Ember.js表示なしのバインド

Question

申し訳ありませんこのようなことが既に求められていますが、私が探しているものを正確に見つけることができません。私は、コンテンツバインディングについてよく理解していると感じていると言って、その質問を序文にしたいと思います。私は正しく動作するためには、div内のimgタグのリストを必要とするサードパーティのjqueryカルーセルプラグインを使用する予定です。実際の質問では、Appコントローラの画像にURLのコレクションがあるとします。コンテンツには、実際の画像への有効なURLのリストが含まれているとします。

App = Ember.Application.create({}); 

App.Controller = Em.Object.create({ 
    content: [{url: 'http://www.google.com'}, {url: 'http://www.yahoo.com'}] 
}); 

App.ImgView = Em.View.extend({ 
    tagName: 'img' 
}); 

はどうすれば#eachに別の{{ビュー}}ネストせずに、現在のURLに各画像のSRCを結合していますか？私は多くの組み合わせを試みましたが、正しいバインディングに指を置くことができませんでした。

<div id="foo"> 
    {{#each App.Controller.content}} 
     {{view App.ImgView bindAttr src="this.url"}} 
    {{/each}} 
</div> 

ハンドルバースクリプトは、上記にエラーになるが、私は私がやろうとしていますどのような通信が可能で、なぜそれは最高のように感じます。

ご協力いただきありがとうございます。

EDIT：もう少し研究を重ねた結果、この問題はhereに遭遇しました。明らかに文字列へのsrcBindingはember-0.9.4のバグであり、ember-0.9.5で修正されています。私は何かに戻って終わった...

App.ImgView = Em.View.extend({ 
    tagName: 'div' 
}); 

<div id="foo"> 
    {{#each App.Controller.content}} 
     {{#view App.ImgView contentBinding="this"}} 
      <img {{bindAttr src="content.url"}} /> 
     {{/view}} 
    {{/each}} 
</div> 

私は私のビューでクリックハンドラを持つことができます。また、プラグインを変更して、#foo内のdiv内の画像もターゲットにするようにしました。

すべての回答ありがとうございます。

Answer 1

あなたが望むように思える：

<div id="foo"> 
    {{#each App.Controller.content}} 
     <img {{bindAttr src="url"}}> 
    {{/each}} 
</div> 

はあなたのためにその仕事をしていますか？

Answer 2

{{view ... }}にはsrcBindingを使用してください。例を参照してください：http://jsfiddle.net/M2S3Z/

imgタグをレンダリングする具体的なEmber.Viewをレンダリングしたいだけで、私はebrynの答えを使用します。

テンプレート：

<script type="text/x-handlebars" > 
    <div id="foo"> 
     {{#each App.Controller}} 
      {{view App.ImgView srcBinding="url"}} 
     {{/each}} 
    </div> 
</script>​ 

JS：

App = Ember.Application.create({}); 

App.Controller = Em.ArrayProxy.create({ 
    content: [{ 
     url: 'http://www.google.com'}, 
    { 
     url: 'http://www.yahoo.com'}] 
}); 

App.ImgView = Em.View.extend({ 
    tagName: 'img', 
    didInsertElement: function() { 
     console.log(this.get('src')); 
    } 
});​ 

Answer 3

私はむしろ、このようなエンバービューの何か活用する力を使用します。

App.ImageView = Ember.View.extend({ 
    tagName: 'img', 
    attributeBindings: ['src'], 
    src: url_attribute_or_variable 
});