angular2 onError 图像绑定答案

【问题标题】：angular2 onError image bindingangular2 onError 图像绑定
【发布时间】：2017-02-09 11:17:48
【问题描述】：

我想知道我们是否可以使用 angular2 在图像标签上绑定或插入 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'"/>

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

但由于某种原因无法正常工作，我不知道我在这里做错了什么

【问题讨论】：

【解决方案1】：

几乎完成了，他只是忘记在活动结束后更改图像。

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

这里是 link

【讨论】：

【解决方案2】：

组件.ts

onImgError(event){
 event.target.src = './assets/imgs/altImg.png'
//Do other stuff with the event.target
}

component.html

 <img [src]="imgUrl" (error)="onImgError($event)">

【讨论】：