ionic2相机图像不显示模板中的整个图像

Question

我想在我的ionic2应用程序中使用相机。我拍照用以下功能：

takePicture(){ 
    Camera.getPicture({ 
     sourceType: Camera.PictureSourceType.CAMERA, 
     destinationType: Camera.DestinationType.FILE_URI, 
     quality: 100, 
     targetWidth: 1000, 
     targetHeight: 1000, 
     correctOrientation: true 
    }).then((imageData) => { 
     // imageData is a base64 encoded string 
     this.base64Image = imageData; 
    }, (err) => { 
     console.log(err); 
    }); 
    } 

，并与下面的HTML显示出来：

<img [src]="base64Image" *ngIf="base64Image" text="{{flavour}}" draw-text crossOrigin style="max-width: : 100%; max-height: 100%;" /> 

但是它不显示我从相机拍摄的HTML格式的完整的图像。 以下是截图： 和原始图像：

为什么有这种差异？如何显示我拍摄的完整图像？

注：我试图改变targetWidth值，但它并没有帮助

Answer 1

这是因为我使用的指令添加文本作为覆盖到拍摄的图像。

我删除了text="{{flavour}}" draw-text，我可以看到整个图像。