基于EmberJS中的路由模型的控制器中的计算属性 [英] Computed property in controller based on route's model in EmberJS
问题描述
我想在控制器中实现计算属性,该属性会在路由模型中的数据更改时更改.
路线:
从'ember'导入Ember;导出默认的Ember.Route.extend({模型() {返回新的Ember.RSVP.hash({成分:this.store.findAll('ingredient'),食谱:this.store.peekAll('recipe')});},setupController:function(controller,modelHash){controller.setProperties(modelHash);}});
控制器:
从'ember'导入Ember;导出默认的Ember.Controller.extend({pageNumber:0,页面大小:16页数:function(){var pages = [];如果(this.model!= null){var content = this.model.recipes;而(content.length> 0){pages.push(content.splice(0,this.get("pageSize"))));}}返回页面;} .property('model.recipes.@ each','pageSize'),recipesOnPage:function(){返回this.get('pages')[this.get('pageNumber')];} .property('pages','pageNumber')});
此代码不会产生任何错误,但不起作用-页面"始终为空.而且,"pages"属性不会在模型更改时重新计算.我究竟做错了什么?以及如何达到预期的效果?
P.S.灰烬版本-1.13.
由于您已经修改了 setupController
钩子,因此您的 controller
具有属性 ingredients
和 recipes
,但没有 model
属性.
因此您的计算属性应为:
页面:function(){//避免在这里使用模型//使用this.get('recipes')代替this.model.recipes} .property('recipes.[]','pageSize')
SetupController挂钩指南链接.>
I want to implement computed property in controller that changes when data in route's model changed.
Route:
import Ember from 'ember';
export default Ember.Route.extend({
model() {
return new Ember.RSVP.hash({
ingredients: this.store.findAll('ingredient'),
recipes: this.store.peekAll('recipe')
});
},
setupController: function(controller, modelHash) {
controller.setProperties(modelHash);
}
});
Controller:
import Ember from 'ember';
export default Ember.Controller.extend({
pageNumber: 0,
pageSize: 16,
pages: function() {
var pages = [];
if (this.model != null) {
var content = this.model.recipes;
while (content.length > 0) {
pages.push(content.splice(0, this.get("pageSize")));
}
}
return pages;
}.property('model.recipes.@each', 'pageSize'),
recipesOnPage: function() {
return this.get('pages')[this.get('pageNumber')];
}.property('pages', 'pageNumber')
});
This code produce no error, but doesn't work - "pages" always empty. And "pages" property doesn't recomputed on model changing. What am I doing wrong? And how to achieve desired result?
P.S. Ember version - 1.13.
Since you have modified setupController
hook, your controller
has properties ingredients
and recipes
, but has no model
property.
So your computed property should be:
pages: function() {
// avoid using model here
// use this.get('recipes') instead of this.model.recipes
}.property('recipes.[]', 'pageSize')
SetupController hook guides link.
这篇关于基于EmberJS中的路由模型的控制器中的计算属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!