我想知道我们是否可以使用 angular2 在图像标签上绑定(bind)或插入 onError,
在 app.component.ts 上:
imageUrl:string;
constructor( ) {
this.imageUrl = 'graphics/placeholder.gif';
}
在 app.component.html 上:
<img class="img-responsive" [src]="'graphics/image-1.jpg'" onError="imageUrl"/>
下面的方法有效。
<img class="img-responsive" [src]="'graphics/image-1.jpg'" onError="this.src='graphics/placeholder.gif'"/>
但是由于我们在应用程序上使用了很多图像,我想将其作为一个简单的动态解决方案,我也找到了这个答案,
Angular 2 - Check if image url is valid or broken
但由于某种原因不起作用,我不知道我在这里做错了什么
最佳答案
几乎完成了,他只是忘了在事件结束后更改图像。
errorHandler(event) {
console.debug(event);
event.target.src = "https://cdn.browshot.com/static/images/not-found.png";
}
这是 link
关于angular2 onError 图片绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42135268/