Angular 2 - 动态设置图像URL

Question

图像路径在item.imagePath中定义。

<div *ngFor="let item of itemList">
   <div style="background-image: url(item.imagePath)" class="thumb">
       <span>{{item.productName}}</span>
   </div>
   <div>
       <p>{{item.productFeature}}</p>
   </div>
</div>

style="background-image: url(item.imagePath)"
什么是正确的语法，因为这不起作用？

Answer 1

样式根据表达式评估的值更新：

键是具有可选项的样式名称。 后缀（即'top.px'，'font-style.em'），值是分配给这些属性的值（以给定单位表示）。

<div [ngStyle]="{'background-image': 'url(' + photo + ')'}"></div>

Answer 2

试试这个

 <div *ngFor="let item of itemList">
       <div class="thumb">
           <img src="{{item.imagePath}}" />
           <span>{{item.productName}}</span>
       </div>
       <div>
           <p>{{item.productFeature}}</p>
       </div>
    </div>