Angular2 - html中的动态变量

Question

我有一个如下所示的列表:

<ul *ngFor="#item of items">
<li><img src="http://something.com/[this needs to be item.id]/picture"></li>
</ul>

我需要将图片网址设置为该项目的ID.我查看了angular2(https://angular.io/docs/ts/latest/guide/template-syntax.html)的src文档,并尝试了以下方法:

<img [src]="http://something.com/{{item.id}}/picture">

但它不起作用.如何根据需要在网址中的项目ID显示图片.

Answer 1

使用属性绑定与字符串文字:

<img [src]="'http://something.com/' + item.id + '/picture'">

或字符串插值属性与{{}}s 绑定:

<img src="http://something.com/{{item.id}}/picture">

请注意,[src]="http://something.com/{{item.id}}/picture">这不起作用,因为属性绑定[]使用语法[property]="template_expression"而template_expression不能包含{{}}s.