如何顯示我的模型內容傳遞到一個餘燼collectionview

Question

下面的餘燼例子使用foundationcss顯示一個手風琴。我已經使用一個ember集合視圖來實現手風琴，並將數據傳遞給內容綁定。

如何在集合視圖中呈現每個項目中的燈具中顯示名稱和DESC？

請用我的jsfiddle理解我的問題： http://jsfiddle.net/theremin/6hLbC/

TEMPLATES

<script> 
    $(document).foundation(); 
</script> 
<script type="text/x-handlebars" data-template-name="application"> 
    <h1>Example</h1> 
    {{outlet}} 
</script> 
<script type="text/x-handlebars" data-template-name="index"> 
    {{view App.AccordionView contentBinding="content"}} 
</script> 

JS

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

App.Store = DS.Store.extend({ 
    revision : 12, 
    adapter  : 'DS.FixtureAdapter' 
}); 

App.Router.map(function() { 

}); 

App.IndexRoute = Ember.Route.extend({ 
    model : function(){ 
     return App.Device.find(); 
    } 
}) 

App.AccordionController = Ember.ArrayController.extend({ 

}); 

App.AccordionView = Ember.CollectionView.extend({ 
    tagName : "div", 
    classNames : ["section-container", "accordion"], 
    attributeBindings : ["data-section"], 
    "data-section" : "accordion", 
    itemViewClass  : Ember.ContainerView.extend({ 
     tagName : "section", 
     childViews   : ["titleView", "contentView"], 
     titleView : Ember.View.extend({ 
      tagName : "div", 
      classNames : ["title"], 
      template : Ember.Handlebars.compile('<p><a href="#">Name:{{name}}{{content}}</a></p>') 
     }), 
     contentView : Ember.View.extend({ 
      tagName : "div data-section-content", 
      classNames : ["content"], 
      template : Ember.Handlebars.compile('<p>desc:{{desc}}</p>') 
     }), 
    }), 
}) 



App.Device = DS.Model.extend({ 
    name : DS.attr('string'), 
    desc : DS.attr('string') 
}); 
App.Device.FIXTURES = [{ 
    id : 1, 
    name: "Plug1", 
    desc: "Some words about plug1" 
}, 
{ 
    id : 2, 
    name: "Plug2", 
    desc: "Some comments about plug2"  
} 
]; 

Answer 1

一個工作版本在這裏http://jsfiddle.net/6hLbC/1/。

基本上，當您製作自定義ContainerView時，Ember不會自動繼承上下文，因此您需要專門定義它。

itemViewClass  : Ember.ContainerView.extend({ 
    tagName : "section", 
    childViews   : ["titleView", "contentView"], 
    titleView : Ember.View.extend({ 
     tagName : "div", 
     classNames : ["title"], 
     contextBinding: "parentView.content", 
     template : Ember.Handlebars.compile('<p><a href="#">Name:{{name}}{{content}}</a></p>') 
    }), 
    contentView : Ember.View.extend({ 
     tagName : "div data-section-content", 
     classNames : ["content"], 
     contextBinding: "parentView.content", 
     template : Ember.Handlebars.compile('<p>desc:{{desc}}</p>') 
    }), 
}),