typescript angular2 onError 图像绑定

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/42135268/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 04:14:56  来源:igfitidea点击:

angular2 onError image binding

angulartypescript

提问by jcdsr

I'm wondering if we can bind or interpolate the onError on the image tag using angular2,

我想知道我们是否可以使用 angular2 绑定或插入图像标签上的 onError,

on the app.component.ts:

在 app.component.ts 上:

imageUrl:string;

  constructor( ) {
      this.imageUrl = 'graphics/placeholder.gif';
   }

on the app.component.html:

在 app.component.html 上:

<img class="img-responsive" [src]="'graphics/image-1.jpg'" onError="imageUrl"/>

The method below works.

下面的方法有效。

<img class="img-responsive" [src]="'graphics/image-1.jpg'" onError="this.src='graphics/placeholder.gif'"/>

But as we using a many images on the app and I would like to make it a simple dynamic solution, I found this answer as well,

但是当我们在应用程序上使用许多图像并且我想让它成为一个简单的动态解决方案时,我也找到了这个答案,

Angular 2 - Check if image url is valid or broken

Angular 2 - 检查图像 url 是否有效或损坏

but for some reason is not working, I don't know what I'm doing wrong here

但由于某种原因不起作用,我不知道我在这里做错了什么

回答by Americo Arvani

It was almost complete he just forgot to change the image after the event.

几乎完成了,他只是在活动结束后忘记改变形象。

errorHandler(event) {
   console.debug(event);
   event.target.src = "https://cdn.browshot.com/static/images/not-found.png";
}

Here is the link

这是 链接