- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试使用 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>
Javascript:
var App = Ember.Application.create();
App.Router.map(function(){
this.resource('categories', { path : '/' });
this.resource('category', { path : '/:category_id' });
});
App.CategoriesRoute = Ember.Route.extend({
model: function(){
return App.Category.find();
}
});
//this is causing the error possibly
App.CategoryRoute = Ember.Route.extend({
model: function(params){
return App.Category.find({parent: params.category_id});
}
});
App.CategoryController = Ember.ArrayController.extend();
// Models
App.Store = DS.Store.extend({
revision: 11,
adapter: 'DS.RESTAdapter'
});
DS.RESTAdapter.configure("plurals", {
category: "categories"
});
App.Category = DS.Model.extend({
name: DS.attr('string'),
parent_id: DS.attr('number')
});
调试信息:
DEBUG: Ember.VERSION : 1.0.0-rc.1
DEBUG: Handlebars.VERSION : 1.0.0-rc.3
DEBUG: jQuery.VERSION : 1.9.0
最佳答案
提示:写完这篇文章后,我意识到您可能没有正确获取模型 Hook 。当您通过 url 进入您的应用程序时,将调用此 Hook 。它将 URL 转换为适当的模型,并使用该模型转换为路由。 我猜你认为这个 model() 钩子(Hook)会用 {{#linkTo}} 的参数调用?事实并非如此!
这不起作用,因为您将单个模型传递给模板中的#linkTo 助手。所以 Ember 希望将这个单个对象设置为 ArrayController 的内容。这会导致您的错误。你的模型钩子(Hook)返回一个数组。 经验法则:您应该始终将相同的数据结构传递给您在模型 Hook 中返回的#linkTo。
因此我建议使用事件而不是 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);
}
}
});
我在这里做了什么?
更新:如何序列化通过实现序列化,您告诉 Ember 将什么放入您的 url。
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")
}
}
});
关于ember.js - Ember -- TypeError : arrangedContent. addArrayObserver 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15341429/
我正在尝试重新加载模型并重新计算 arrangedContent。该模型似乎正在重新加载,但未重新计算 arrangedContent。对数据进行排序很好,它正在添加和删除导致问题的数据。 reloa
我正在尝试使用 ember 构建一个简单的类别浏览器。我有两个非常简单的观点。当用户访问 / 时,他们将看到所有类别的列表,当他们单击该列表中的类别时,他们将被定向到 #/10,其中 10 是 ID。
我正在尝试使用一个 HTML 选择标记在 Ember.ArrayController 子类中设置动态排序,如下所示: App.ListController = Ember.ArrayControlle
我是一名优秀的程序员,十分优秀!