Ember.js Ember--类型错误：arrangedContent.addArrayObserver不是函数

我正在尝试用ember构建一个简单的类别浏览器。我有两个非常简单的观点。当用户访问

/

时，他们将看到所有类别的列表，当他们单击该列表中的类别时，他们将被定向到

#/10

，其中10是id

我的问题是，当用户单击

/

路线上的类别时，我会得到以下错误

TypeError: arrangedContent.addArrayObserver is not a function
[Break On This Error]   

didChange: 'arrangedContentArrayDidChange'

如果我在

#/10

路径上刷新页面，则会对我的后端

/api/categories？parent=99

进行正确的api调用。在转换过程中抛出此错误可能是我做错了什么？下面是我的代码的完整示例

模板：

<script type="text/x-handlebars">
  {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="categories">
    {{#each category in controller}}
        <p>{{#linkTo 'category' category}}{{ category.name }}{{/linkTo}}</p>
    {{/each}}
</script>

<!--this is an array instead of object -->
<script type="text/x-handlebars" data-template-name="category">
    {{#each category in controller}}
        <p>{{category.name}}</p>
    {{/each}}
</script>

调试信息：

DEBUG: Ember.VERSION : 1.0.0-rc.1
DEBUG: Handlebars.VERSION : 1.0.0-rc.3
DEBUG: jQuery.VERSION : 1.9.0

---

提示：写完这篇文章后，我意识到您可能没有正确使用模型挂钩。当您通过url输入应用程序时，将调用此挂钩。它将URL转换为适当的模型，并使用此模型转换为路由我猜你认为这个model（）钩子会用{{{#linkTo}的参数调用？事实并非如此

这不起作用，因为您正在将单个模型传递给模板中的#linkTo助手。因此，Ember希望将此单个对象设置为ArrayController的内容。这会导致您的错误。模型钩子返回一个数组经验法则：您应该始终将相同的数据结构传递给#linkTo，并在模型挂钩中返回该链接。

因此，我建议使用事件而不是链接，并执行以下操作：

<script type="text/x-handlebars" data-template-name="categories">
    {{#each category in controller}}
        <p {{action 'showParentCategory' category}}>{{category.name}}</p>
    {{/each}}
</script>

App.CategoriesRoute = Ember.Route.extend({
    model: function(){
        return App.Category.find();
    },
    events: {
      showParentCategory : function(parentCategory){
        var cats = App.Category.find({parent: parentCategory.get("category_id")});
        this.transitionTo("category", cats);
      }
    }
});

如果对一个数值执行#每个，而不是对模板中的数组内容执行，则会出现此问题

我的“投票”模型中有一个数值计数。我反复说

{{#content.count中的每个轮询} {{/每个}}

---

我想，我们只能在余烬阵列上使用#每个阵列。

我有点困惑。CategoriesRoute应显示类别列表，而CategoryRoute应显示给定类别的详细信息？是这样吗？那么，为什么在两个把手模板中都使用“每个辅助对象”？我怀疑CategoryRoute只显示了一个类别的有效负载。两个模板都显示了一个类别列表。单一类别模板显示了一个类别列表，其父类别id=to params.category\u id。这就是我使用App.category.find（{parent:params.category\u id}）的原因；以填充模型。以及为什么事情很可能会失控。这看起来真的很好，但我得到了一个错误。SyntaxError:function语句需要一个名称showParentCategory:function（parentCategory）{是的，我也注意到了。还必须将.get（“category_id”）更改为.get（“id”）。一件似乎不正确的事情是，每个类别现在都链接到#/undefined而不是#/10。这是预期的行为吗？此外，如果我将相同的逻辑添加到类别模板中，我会得到以下错误：没有处理事件“showParentCategory”。因此，此解决方案似乎限制了进一步深入的能力。可能是这样的非常适合同时删除类别模板。该操作可由与模板连接的视图、控制器或路由处理。当类别模板处于活动状态时，您在映射中处于完全独立的路径中。谢谢，我该如何将父类别id获取到路由中？因此，我的URL为#/10而不是of#/undefined？这个.transitiono（）似乎没有这个功能。

<script type="text/x-handlebars" data-template-name="categories">
    {{#each category in controller}}
        <p {{action 'showParentCategory' category}}>{{category.name}}</p>
    {{/each}}
</script>

App.CategoriesRoute = Ember.Route.extend({
    model: function(){
        return App.Category.find();
    },
    events: {
      showParentCategory : function(parentCategory){
        var cats = App.Category.find({parent: parentCategory.get("category_id")});
        this.transitionTo("category", cats);
      }
    }
});

App.CategoryRoute = Ember.Route.extend({
    model: function(params){
        return App.Category.find({parent: params.category_id});
    },
    serialize : function(models){
        var first = models.objectAt(0);
        return {
            category_id : first.get("parentId")
        }
    }
});