Angular / Phonegap应用程序：无法使用文件URI显示图像

Question

我正在使用Phonegap的getPicture（）方法将文件URI保存到图像中，然后我尝试在img元素中显示，但不能。这里有更多细节。

1. 我有一个包含以下图片元素的视图：<img id='myImage' ng-src="{{imageSrc}}" style='width:320px;display:block'/>

2. 当我在视图中按下一个按钮时，它会调用视图控制器中的getPhoto（）方法。这是控制器的代码：

   .controller('captureController',function($scope,$rootScope,$state,$document){
   
   $scope.getPhoto = function() {
   navigator.camera.getPicture(
       captureSuccess,
       captureError,
       {
        quality:5,
        destinationType: Camera.DestinationType.FILE_URI,
        sourceType: Camera.PictureSourceType.CAMERA,
        encodingType: Camera.EncodingType.PNG
       }
   );  
   }
   
   
   function captureSuccess(imageURI) {
       var image = document.getElementById('myImage');
   
       $rootScope.imageSrc=imageURI
       $rootScope.$apply()
       alert($rootScope.imageSrc)
   
   
   }
   
   
   function captureError(error) {
   var msg = 'An error occurred during capture: ' + error.code;
   alert('there was an error')
   }
   
   })
   

3. 当我拍照时，生成的警报会返回照片的路径（文件：///var/mobile/Applications//tmp/cdv_photo_069.png），但照片不会出现在图片元素中。

我已经确认照片在手机的tmp目录中，我也尝试用src =“file：///....cdv_photo.png”替换图像元素的ng-src属性。图像元素仍未渲染图片。

非常感谢任何建议。