html - 如何以角度 9将字节 [] 渲染为图像
问题描述
我无法将我的 byte[] 渲染到图像上。我找到了各种解决方案,但到目前为止,没有人在 Angular 9 中为我工作。
图像模型
export class Image {
id: string
imageName: string
imageData: any
message: string
}
.ts 文件
import { DomSanitizer, SafeResourceUrl} from '@angular/platform-browser';
import { Service} from 'src/app/services/Service.service';
constructor(private service: Service, private sanitizer: DomSanitizer) { }
image: Image;
imgRecourse: SafeResourceUrl;
this.service.getImage(imageId).subscribe(
data => {
this.image = data as any;
this.imgRecourse = this.sanitizer.bypassSecurityTrustResourceUrl('data:image/jpg;base64,' + this.image.imageData);
}
)
HTML
<div class="picture" *ngIf="imgRecourse">
<img id="img" src="{{imgRecourse}}">
</div>
它在每个解决方案中都向我显示了一个警告,即
core.js:6901 WARNING: sanitizing unsafe URL value SafeValue must use [property]=binding: data:image/jpg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAQ4B4ADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAEC...
请帮帮我
谢谢。
解决方案
<div class="picture" *ngIf="imgRecourse">
<img id="img" [src]="imgRecourse">
</div>
推荐阅读
- c# - C# 启动的线程多于预期
- react-native - 在 React Native 应用程序中预加载/预填充 PouchDB
- c++ - C++ 中正则表达式的特殊字符问题
- redis - ELK 堆栈和 Redis。我可以停止清空数据库吗?
- ionic-framework - 如何通过单击在ionic2中打开的相机上的后退按钮导航到页面
- python - ValueError: steps=None 仅对基于 keras.utils.Sequence 类的生成器有效
- angular - 将自定义控件中的验证传递给放置它的表单
- java - 如何将枚举添加到枚举列表并循环遍历它们
- odoo - 优化代码以获得更好的性能和质量
- angularjs - ng-repeat 不以表格格式显示数据