使用 Angular 4 src 显示图像

Question

使用 AngularJS 可以显示如下图像：

ng-src="public/img/{{item.image}}" 

{{item.image}} 存储在 MongoDB 中的位置。

因此，我的问题非常简单......我如何在 Angular 4 中实现同样的目标？

Answer 1

其中任何一个：

<img src="public/img/{{item.image}}" />
<img [src]="'public/img/'+item.image" />

Answer 2

类似这样的：

<img src = "public/img/{{item.image}}">

或者正如 Pankaj 指出的那样：

<img [src] = "'public/img/' + item.image">

Angular 文档中有一个章节将 AngularJS 功能映射到可能有用的 Angular 功能：

https://angular.io/guide/ajs-quick-reference#ng-src

Answer 3

类似的方法也可以：

<img [src] = `public/img/${item.image}`>

使用反引号代替单引号或双引号以及 ${variable_name}。