model - EmberのImg要素URLへのモデルプロパティの挿入

Question

プロパティを持つモデルがありimage_idます。画像要素を含むそのモデルのビューがあります。srcこれを効果的に行うには、画像のURLを完成させるために画像要素のプロパティにIDを挿入する必要があります。

<img src="news + newsItem.imageID + .jpg"></img> 

私の最初の試みはHandlebarsヘルパーを使用しました：

<img src="news{{newsImageURL newsItem.imageID}}.jpg"></img> 

しかし、これはその周りにMetamprphスクリプトタグも挿入しました：

<img url="&lt;script id='metamorph-10-start' type='text/x-placeholder'&gt;&lt;/script&gt;news/7.jpg&lt;script id='metamorph-10-end' type='text/x-placeholder'&gt;&lt;/script&gt;" alt="" class="content-image news-media" /></a>

を使用することを検討しましたがbindAttr、image_id値を変換する必要があるため（パスの残りの部分を追加して追加することにより）、これも解決策のようには見えません。

Answer 1

2つの可能性があります：

1-画像パスをモデルの計算済みプロパティとして宣言します。それが気に入らない場合は、このテンプレートをサポートするObjectControllerでも宣言できます。

テンプレート：

// until 1.0 RC7
<img {{bindAttr src="newsItem.imagePath"}}></img> 
// from 1.0 final (the above one is deprecated)
<img {{bind-attr src=newsItem.imagePath}}></img> 

モデル：

App.NewsItem = DS.Model.extend({
  imageID: DS.attr('string'),
  imagePath: function() {
    return "/assets/news/"+this.get("imageID")+".jpg";
  }.property('imageID')
});

2- 1のバインディングが必要ない場合（IDは変更されないと思います）、を使用します unbound helper。これにより、スクリプトタグは作成されません。

<img src="news{{unbound newsItem.imageID}}.jpg"></img> 

Answer 2

bindAttrに計算プロパティを参照させ、そこで文字列を作成できます。