SafeValue必须使用[property] = binding,但它是

时间:2017-12-04 20:30:53

标签: angular typescript

大家好,这让我疯了。我尝试了我能在网上找到的所有修复程序,似乎没有任何工作。

我从DB加载base64图像信息,返回base64编码的图像,如下所示:

/9j/4AAQSkZJRgABAQEBLAEsAAD/4UHuRXhpZgAATU0AKgAAAAgABgEaAAUAAAABAAAAVgEbAAUAAAABAAAAXgEoAAMAAAABAAIAAAITAAMAAAABAAEAAIdpAAQAAAABAAAIcuocAAcAAAgMAAAAZgAAEOQAAAEsAAAAAQAAASwAAAABHOoAAAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA...

然后在我的TS文件中,我有以下功能:

photo_url(data:string){

     this.user_photo = this.domSanitizer.bypassSecurityTrustResourceUrl('data:image/jpeg;base64,' + data).toString();

}

我的HTML文件如下所示:

<img [src]="user_photo ? user_photo : 'assets/img/default.png'">

但是我收到以下错误,图片没有显示:

WARNING: sanitizing unsafe URL value SafeValue must use [property]=binding: data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEBLAEsAAD/4UHuRXhpZgAATU0AKgAAAAgABgEaAAUAAAABAAAAVgEbAAUAAAABAAAAXgEoAAMAAAABAAIAAAITAAMAAAABAAEAAIdpAAQAAAABAAAIcuocAAcAAAgMAAAAZgAAEOQAAAEsAAAAAQAAASwAAAABHOoAAAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA...

错误说sanitizer应该使用属性绑定,但它仍然显示错误和图像不显示。

我在这里错过了什么吗?

谢谢!

1 个答案:

答案 0 :(得分:4)

当您使用.toString时,您根据需要将user_photo设置为字符串而不是SafeResourceUrl

实际上,只需移除.toString()即可使其正常工作。否则你基本上只是撤消DomSanitizer的工作。

user_photo: SafeResourceUrl;
photo_url(data: string){
     this.user_photo = this.domSanitizer.bypassSecurityTrustResourceUrl(
       'data:image/jpeg;base64,' + data);
}