угловые 2: прикрепление строки со свойством связывания

Question

Я пытаюсь прикрепить строку с Собственостью связывания

, например, мой объект

{ 
    "name": "The Walking Dead", 
    "imageUrl": "/title/tt1520211/?pf_rd_m=A2FGELUUNOQJNL&pf_rd_p=2240084122&pf_rd_r=1Q5ZRDHSA2ZK5S6Q31WN&pf_rd_s=center-1&pf_rd_t=15506&pf_rd_i=tvmeter&ref_=chttvm_tt_1", 
    "rating": "8.6" 
}, 

как я не имею базовый URL в поле ImageUrl я хочу приложить это в угловой шаблон URL

шаблона:

<tbody *ngFor="let prod of products"> 
<tr > 
    <td><img [src]="'www.example.com/'+{{prod.imgUrl}}" alt=""></td> 
    <td>{{prod.name}}</td> 
    <td>{{prod.rating}}</td> 
</tr> 

</tbody> 

Я пытаюсь добавить example.com Ф.О. г мой ImageUrl в моем шаблоне поле и я не могу добавить Базовый URL

Im ожидающей URL быть BaseUrl + путь

www.example.com/title/tt1520211/?pf_rd_m=A2FGELUUNOQJNL&pf_rd_p=2240084122&pf_rd_r=1Q5ZRDHSA2ZK5S6Q31WN&pf_rd_s=center-1&pf_rd_t=15506&pf_rd_i=tvmeter&ref_=chttvm_tt_1 

Answer 1

Вам не нужно использовать фигурные скобки. Просто сделайте просто:

<img [src]="'www.example.com/' + prod.imgUrl">

---

<tag [someAttr]="someValue">

В Угловом это означает, что someValue будет оцениваться (как внутри {{}}) и назначен someAttr, поэтому для части строки, вы должны использовать кавычки, как в чистом виде JS

---

<tag someAttr="someString">

означает, что someString будет анализироваться как шаблон, (вы должны использовать {{}} для оценки imgUrl) и назначен someAttr

в вашем например <img src="www.example.com/{{prod.imgUrl}}">

---

someAttr является свойством @Input() в компоненте или HTMLElement свойство,

Answer 2

Попробуйте так:

<img src="www.example.com/{{prod.imgUrl}}" alt=""> 

Answer 3

или вы можете попробуйте

<td><img [src]="'www.example.com/' + prod.imgUrl" alt=""></td> 

без curcly брекет