Question

通过cordova相机插件拍照并在html中显示后，我希望用户可以选择是否进行编辑（裁剪，设置宽高比，调整大小），或按原样上传。

有没有办法这样做？

HTML

<ion-header-bar class="bar-assertive">
    <h1 class="title">Photos</h1>
</ion-header-bar>
<ion-content ng-controller="ImgCtrl" padding="true">
    <button class="button button-full button-assertive" ng-click="takePhoto()"> Take Photo </button>    
    <img ng-show="imgURI !== undefined" ng-src="{{imgURI}}" style="text-align: center">
</ion-content>

的Javascript

$scope.takePhoto = function() {                  
  var options = {                    
        quality: 75,
        destinationType: Camera.DestinationType.DATA_URL,
        sourceType: Camera.PictureSourceType.CAMERA,
        allowEdit: true,
        encodingType: Camera.EncodingType.JPEG,
        correctOrientation: true,
        targetWidth: 800,
        targetHeight: 1100,
        popoverOptions: CameraPopoverOptions,
        saveToPhotoAlbum: false                  
    };                      
    $cordovaCamera.getPicture(options).then(function(imageData) {
        // Saving the image  for later access
                            
        $scope.imageURI = "data:image/jpeg;base64," + imageData;

        $ionicLoading.show({
            template: 'Photo taken',
            duration: 1000
        });
                       
    }, function(err) {     
         $ionicLoading.show({
            template: 'Error  ...',
            duration: 900
        });                               
    });                
}

Answer 1

尝试使用Camera.DestinationType.FILE_URL，响应将是一个url，您可以直接将其传递给ur-src。对于您的代码，您的“imageURI”实际上是一个包含图像的base64字符串的字符串。

离子＆amp; cordova裁剪图像然后上传它

1 个答案: