在img元素angular4上多次调用（加载）和（错误）

我使用的是angular 4，它有一个图像标签，一开始应该有一个占位符，当加载图像时，图像会发生变化，但如果出现错误，占位符图像就会出现

这是我的密码

<img src="/assets/img/placeholder.jpg" 
 (error)="imageError($event)" 
             (load)="loadImage($event, image)"
             class="offer-img-mobile img-fluid" >



imageError(event) {
    event.target.src = '/assets/img/placeholder.jpg';
  }
  loadImage(event, image) {
    event.target.src =  image.imageurl;
  }

imageError（事件）{
event.target.src='/assets/img/placeholder.jpg'；
}
loadImage（事件、图像）{
event.target.src=image.imageurl；
}

现在出现的问题是加载和错误被多次调用，因此图像在错误图像和图像加载之间不断切换（这会引发错误，因此它们不可见）

---

在图像上不使用

load

和

error

方法，只需像这样使用绑定即可

<img [src]="image.imageurl || '/assets/img/placeholder.jpg'" 
class="offer-img-mobile img-fluid" >

---

这将等待图像从服务器加载，同时它将显示您的占位符图像。

但问题是，当图像引发错误时，没有占位符，只有iconSo可以使用某种方法处理错误/异常，并通过该函数返回图像/占位符图像