Question

我正在尝试使用项列表创建CollectionView，并将其渲染到CollectionView的{{1}}属性中指定的模板中。但是，我无法让它发挥作用。

它看起来像这样：

templateName

使用这样的模板：

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，但显然，没有列表项。

这是一个错误吗？或者我错过了什么？

- 这是代码中的js小提琴：http://jsfiddle.net/S46vH/

Answer 1

由于Ember.CollectionView是Ember.ContainerView的子类，因此它没有自己的模板。

来自API文档：

容器视图上的template，templateName，defaultTemplate，layout，layoutName或defaultLayout属性不会导致呈现模板或布局。 Ember.ContainerView的DOM表示的HTML内容将只是其子视图的呈现HTML。

要完成此工作，您可以将collection_template标记移动到应用程序模板中或将其设置为部分。然后将{{outlet}}替换为{{collection App.CollectionViewTest}}

如何使用Ember.CollectionView模板

1 个答案: