更新图片源(ng-src)与手机相机或图书馆图片

Update image source (ng-src) with phone camera or library picture

本文关键字：手机 相机 图书馆 ng-src 更新      更新时间：2023-09-26

在视图中，有一个图像标签:

<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);

按预期工作;初始图像被新图像替换。然而，我想用"angular的方式"来做，并通过更新$scope来触发替换。Uri而不是设置image。直接src。

但是，如果我注释掉回调中的第一行，并取消注释后面的两行，那么对于新的图像源，即使是$scope，也会得到404错误。Uri == image.src!

我做错了什么?

D'oh!

这是完全不同的东西——我必须明确地将文件和内容协议列入白名单:

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

它现在工作了。谢谢你的建议!

相关文章：