Angular2 - html中的动态变量

Question

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

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

我需要将图片网址设为项目内容的网址。我查看了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不能包含{{}}。