web-dev-qa-db-ja.com

Angular 2：Dynamic Images

Angular2でimgタグを設定する最良の方法は何ですか？

これは機能しません（キーが原因ではありません）：

<img src="//maps.googleapis.com/maps/api/streetview?size=400x400&location="{{property.lat}}, {{property.long}}"key=aiwefmboij234blahblah" />

Lat/long値をsrc属性に渡すにはどうすればよいですか？

ありがとう！

imageangularbinding
19
LargeDachshund

Src属性の "を閉じる必要はありません。閉じると、次のようなレンダラーになります。

<img src="//maps.googleapis.com/maps/api/streetview?size=400x400&location=" 12.121212 , 13.31133 "&key=aiwefmboij234blahblah" />

これは正しいHTMLではありません。

正しく実行する1つの方法：

<img src="//maps.googleapis.com/maps/api/streetview?size=400x400&location={{property.lat}},{{property.long}}&key=aiwefmboij234blahblah" />

別の方法は、コンポーネントにURLを作成して変数に割り当てることです。

<img [src]="urlVariable" />
47
Abdulrahman