檢測名稱相同但值不同的 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)
 }