Angular2 - динамическая переменная в HTML

Question

У меня есть список, который выглядит следующим образом:

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

мне нужно URL-адрес изображения, чтобы быть таким идентификатором элемента. Я посмотрел на документацию Src для angular2 (https://angular.io/docs/ts/latest/guide/template-syntax.html) и попытался следующее:

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

, но это не сработало. Как я могу показать изображение на основе идентификатора элемента, который должен быть в URL-адресе.

Answer 1

Используйте свойство связывания с строковых литералов:

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

или строка интерполяции свойство связывания с {{}} с:

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

---

Обратите внимание, что [src]="http://something.com/{{item.id}}/picture"> не работает, потому что свойство связывания с [] использования синтаксис [property]="template_expression" и template_expression не могут содержать {{}} s.