Angular 尽管填充了变量，但图像 src 未更新

Question

我有以下代码：

app.component.html:

<button (click)="updateImage('image1.png')"></button>

<img src="{{selectedImage}}" alt="" />

app.component.ts:

selectedImage;

updateImage(image) {
    this.selectedImage = image;
}

我的问题是...如果图像 url 已通过，为什么图像 src 没有更新？

Answer 1

使用[src]代替src

<img [src]="selectedImage" alt="" />

Answer 2

此外，请确保您的路径正确。代码看起来不错，但应用程序可能找不到您的图片。如果是这种情况，您的浏览器控制台将出现错误 404。

尝试将图像放入您的 assets 文件夹并将其与 updateImage('/assets/image1.png')

链接

Angular Image src not updating although variable is populated