Javascript 使用手机摄像头或库图片更新图像源（ng src）

在视图中，有一个图像标记：

<img id="profile-photo" ng-src="{{uri}}"/>

用户可以从其图库中选择一张图片或拍摄一张照片来替换初始图像源：

$scope.uri = 'test.jpg';

navigator.camera.getPicture((uri: string) => {
    var image = <HTMLImageElement>document.getElementById('profile-photo');
        image.src = uri;
        //$scope.uri = uri;
        //$scope.$apply();
    }, (error: string) => {
        console.error(error);
}, options);

navigator.camera.getPicture（（uri:string）=>{
var image=document.getElementById（'profile-photo'）；
image.src=uri；
//$scope.uri=uri；
//$scope.$apply（）；
}，（错误：字符串）=>{
控制台错误（error）；
}，选项）；

这是意料之中的事；初始图像将替换为新图像。但是，我希望以“角度的方式”执行此操作，并通过更新$scope.uri而不是直接设置image.src来触发替换

但是，如果我注释掉回调中的第一行并取消注释下面的两行，那么新的映像源将出现404错误，即使$scope.uri==image.src

我做错了什么？

D'oh

这完全不同——我必须明确地将文件和内容协议列为白名单：

module.config( function($compileProvider){
  $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|file|content):/);
})

---

现在可以了。谢谢你的建议

我看到你试过

$scope.apply（）

但是你试过在apply中包装

$scope.uri=uri

吗？请检查这是否对你有帮助@Ronnie:你的意思是：

$scope.$apply（（）=>{$scope.uri=uri；}）？同样的问题。也尝试过用$timeout包装它。@RahulNaik:据我所知，他们使用指令和$setViewValue来更新图像源。为什么在控制器中更新它却不起作用？