检测名称相同但值不同的 Angular 绑定变化？

Question

我正在使用个人资料图片更改 api。 每次我更改图像时，我都会从服务器获取更改后的图像，但具有相同的 url （比如 test.jpeg ）。

  url: string; 

 <img [src]="url" />

 url : test.jpeg   // url returned from server on image change first time
 url : test.jpeg   // url returned from server on image change second time
 url : test.jpeg   // url returned from server on image change third time

尽管服务器返回不同的图像 angular 无法检测到，因为 url 没有变化。 如何解决这个问题？

Answer 1

简单的方法是添加一些假的查询参数。

 get src() {
   return this._imageSrc + '?q=' + this.hash;
 }

 pictureWasUpdated() {
  this.hash = Math.random().toString(16)
 }