Ember 计算属性不使用服务器数据

Question

我不明白为什么我的计算属性不起作用，但这似乎与从服务器获取数据有关。当应用程序从服务器获取数据时，常规的属性 (days) 将正确显示（见下图），但计算的属性 (dates)产生两个空的 <li>s。但是，当我通过 this.store.push 在路由对象的 model 函数中插入数据时（因此在呈现视图之前数据在客户端上），那么这两个属性是否都正确显示？

如何在从服务器获取 hasMany 关系模型后重新计算已计算的属性？

日历模型：

import DS from 'ember-data';
import Ember from 'ember';

export default DS.Model.extend({
    name: DS.attr('string'),
    days: DS.hasMany('day'),
    dates: Ember.computed('days.@each', function () {
        return this.get('days').map(day => day.get('date'));
    })
});

白天模型

import DS from 'ember-data';

export default DS.Model.extend({
    date: DS.attr('string'),
    calendar: DS.belongsTo('calendar')
});

景色

The "regular" property
<ul>
{{#each model.days as |d|}}
    <li>{{d.date}}</li>
{{/each}}
</ul>

The computed property
<ul>
{{#each model.dates as |d|}}
    <li>{{d}}</li>
{{/each}}
</ul>

路由中的数据

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    this.store.push({
      "data": [{
        "type":"calendar",
        "id":1,
        "attributes": {
          "id":1,
          "name":"first calendar",
          "days":[2,3],
        },
        "relationships": {
          "days": {
            "data":[
              {"id":2,"type":"day"},
              {"id":3,"type":"day"}
            ]
          }
        }
      }, {
        "type":"day",
        "id":2,
        "attributes":{
          "id":2,
          "calendar":1,
          "date":"2016-06-15"
        }
      }, {
        "type":"day",
        "id":3,
        "attributes":{
          "id":3,
          "calendar":1,
          "date":"2016-06-17"
        }
      }]
    });

    return this.store.findRecord('calendar', 1);
  }
});

Answer 1

我认为你的计算属性不起作用，因为 "days" 是异步的，不能计算属性除非你指定属性 - 正如建议的那样托三郎。

另一种出路是使用 computed.mapBy:

http://emberjs.com/api/classes/Ember.computed.html#method_mapBy

dates: Ember.computed.mapBy('days', 'date')

有一种使用 PromiseArray 的方法

dates: function() {
        return DS.PromiseArray.create({
            promise: Ember.RSVP.all(this.get('days')).then(days => days.mapBy('date'))                     
       });     
}.property('days.[]'),

Ember 计算属性不使用服务器数据

Ember Computed Properties not Working with Server Data

javascript

ember.js

ember-data

日历模型：

白天模型

景色

路由中的数据