Question

我曾经能够做这样的事情来获得一个嵌套的无序项目列表：

使用Javascript：

App.Menu = Em.View.extend({

    controller: App.menuController.create({}),

    tagName: 'ul',

    templateName: 'Menu',

    pageBinding: 'controller.page'

});

车把：

<li>
    {{page.menuTitle}}
    {{#each page.childrenPages}}
        {{view App.Menu pageBinding="this"}}
    {{/each}}
</li>

的index.html：

<script type="text/x-handlebars">
    {{view App.Menu}}
</script>

现在，在更新到最新的Ember.js（0.9.6）之后，只显示任何给定项目集合的最后一项（在<li>中作为单个<ul>）。在以前版本的Ember中，显示了包含给定集合的所有项目的嵌套<ul> / <li>列表。

我认为每次通过{{#each}}创建新的App.Menu视图时，现在的视图只是被重用了......关于如何实现类似于旧行为的任何想法？

Answer 1

我认为问题在于，通过在类controller中创建App.Menu，App.Menu的每个具体实例的controller属性都是相同的，请参阅Understanding Ember.Object。< / p>

我已将绑定移动到视图类之外的特定控制器并且它可以正常工作，请参阅http://jsfiddle.net/pangratz666/DgG9P/

<强>车把：

<script type="text/x-handlebars" data-template-name="Menu" >
    <li>
        {{page.menuTitle}}
        {{#each page.childrenPages}}
            {{view App.Menu pageBinding="this"}}
        {{/each}}
    </li>
</script>

<script type="text/x-handlebars">
    {{view App.Menu pageBinding="App.mainPage" }}
</script>

<强>的JavaScript ：

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

App.Menu = Em.View.extend({
    tagName: 'ul',
    templateName: 'Menu'
});

App.mainPage = Ember.Object.create({
    menuTitle: 'main page',
    childrenPages: [Ember.Object.create({
        menuTitle: 'subtitle 1',
        childrenPages: [Ember.Object.create({
            menuTitle: 'subtitle 1 - child 1'
        })]
    }), Ember.Object.create({
        menuTitle: 'subtitle 2',
        childrenPages: [Ember.Object.create({
            menuTitle: 'subtitle 2 - child 1'
        })]
    })]
});

升级到Ember 0.9.6后，手柄模板中的递归视图无法正常工作

1 个答案: