如何使用帶有Ember.CollectionView的模板

我正在嘗試創建一個帶有項目列表的CollectionView，並將其渲染到CollectionView的templateName屬性中指定的模板中。但是，我無法讓它工作。如何使用帶有Ember.CollectionView的模板

它看起來像這樣：

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

App.ItemView = Ember.View.extend({ 
    templateName: 'item_template', 
    tagName: 'li' 
}); 

App.CollectionViewTest = Ember.CollectionView.extend({ 
    templateName: 'collection_template', 
    itemViewClass: App.ItemView, 

    content: [ 
     { title: 'Item 1' }, 
     { title: 'Item 2' } 
    ] 
});

像這樣的模板：

<script type="text/x-handlebars" data-template-name="application"> 
    <h1>Testing CollectionView TemplateName</h1> 
    {{collection App.CollectionViewTest}} 
</script> 

<script type="text/x-handlebars" data-template-name="collection_template"> 
    <h2>The CollectionView Template</h2> 
    <ul> 
     {{outlet}} 
    </ul> 
</script> 

<script type="text/x-handlebars" data-template-name="item_template"> 
    {{title}} 
</script>

正因爲如此，在<h2>永遠不會被渲染，除非我改變App.CollectionViewTest到Ember.View，但隨後，顯然，沒有列表項目。

這是一個錯誤？或者我錯過了什麼？

- 這裏有一個JS撥弄代碼：http://jsfiddle.net/S46vH/

來源

2013-07-08 rainbowFish

你的http://jsfiddle.net/S46vH/基本上是空白的，你在發佈這裏鏈接之前保存了最新版本嗎？ – intuitivepixel

oops，no。應該是：http://jsfiddle.net/S46vH/1/但現在問題解決了。感謝任何如何。 – rainbowFish

由於Ember.CollectionView是Ember.ContainerView一個子類，它並沒有自己的模板。

從API文檔：

模板，TEMPLATENAME，defaultTemplate，佈局，layoutName或在容器視圖defaultLayout屬性將不會導致在模板或佈局被渲染。 Ember.ContainerView的DOM表示的HTML內容將只是其子視圖的呈現HTML。

要使這項工作，您可以將collection_template標記移動到應用程序模板或使其成爲一個部分。然後替換{{outlet}}與{{collection App.CollectionViewTest}}

來源

2013-07-08 22:47:00

啊，這很有道理。我感到困惑的是'template'和'templateName'在Ember API'CollectionView'頁面都被列爲屬性。謝謝你的提示！ – rainbowFish

是的，這也讓我絆倒了幾次。 –

如何使用帶有Ember.CollectionView的模板

回答

相關問題