Ember js @each一层深,但我有两个深层关系

Hal*_*lig 4 ember.js computed-properties

我必须在我的控制器[]上访问一个两级深的属性,但是唯一可以通过emberjs指南访问一个级别的属性.

model(params) {
    params.paramMapping = {
        page: "page",
        perPage: "per_page",
        total_pages: "pages"
    };

    return this.findPaged('contractf', params);
},

setupController(controller, model) {
    model.forEach(function(item) {
        item.set('sale_price', item.get('dealers_sched_id.sale_price'));
    });

    controller.set('content', model);
},
Run Code Online (Sandbox Code Playgroud)

上面,我的模型基本上是在contractf模型中以分页格式获取所有记录.然后我设置我的控制器并循环遍历所有这些模型并绑定一个sale_price属性,该属性进入它的关系,以使sale_price获得正确的模型关系.

现在在我的模板中,我有这个:

new_suggested_price: Ember.computed('selectedItems', 'selectedItems.[].sale_price', function() {
    var ret = 0;

    this.get('selectedItems').filterBy('car_used', 'N').forEach(function(contract){
        var salePrice = contract.get('sale_price');

        if (salePrice) {
            ret += (salePrice*100);
        }
    });

    return ret/100; // We *100/100, so we avoid a floating point calc error.
}),
Run Code Online (Sandbox Code Playgroud)

基本上只给我一个容易格式化的数字.正如您所看到的,它取决于selectedItems(基本上是模型,但是属性过滤).所以我必须进入每个模型项并找到sale_price我设置的属性,如果它改变,这个计算属性将更新.阅读Ember的指南,我做不到,selectedItems.[].dealers_sched_id.sale_price因为它只有一层深.

我认为在setupController上设置一个属性可以解决这个问题,但它似乎并不是因为我仍然得到NaNsale_price值.

现在,如果我将setTimeout函数设置为500毫秒,它会填充正常.如何在页面加载时定义它?

感谢您的任何帮助.

And*_*aus 17

为什么会出现这个问题

Ember API确实允许您在计算的属性依赖项中仅使用一个级别的@each/ [].

这种限制可能是人为的,因为使用两个或更多@each级别会对内部观察者维护产生巨大的性能影响.

因此,您必须避免在CP依赖关系链中使用多个@each/ [].

如果你不能有N个蜡烛的蛋糕,那么N个蛋糕每个都有一个蜡烛

但有时你的生意要求你必须达到或超过更高水平.

不要害怕!这可以通过计算属性链实现,其中每个属性只有一个@each级别.

说,你有Foo,Bar和Baz模型,并希望依赖

foos.@each.bars.@each.bazes.@each.name
Run Code Online (Sandbox Code Playgroud)

这是您需要创建的一系列计算属性:

  • barsArrays: computed('foos.@each.bars')-地图foosbars.你将拥有一系列条形数组.
  • bars: computed('barsArrays.[]') - 将其展平以接收一系列条形图.
  • bazesArrays: computed('bars.@each.bazes')-地图barsbazes.
  • bazes: computed('bazesArrays.[]')- 变平bazesArrays.
  • bazesNames: computed('bazes.@each.name')-地图bazesname.

如何缩短链条

请注意,您可以依赖于bar.bazes一个永远不会被其他数组替换的关系数组(只是其内容更改,但数组对象保持不变),从而缩短此链(但不一定更高性能).

  • bazesArrays: computed('foos.@each.bars')-地图foosbars,压平,然后通过映射bazes.你将拥有一系列的bazes阵列.
  • bazes: computed('bazesArrays.[]')- 变平bazesArrays.
  • bazesNames: computed('bazes.@each.name')-地图bazesname.

这是一个有效的演示:http://emberjs.jsbin.com/velayu/4/edit?html,js,output