如何使用 EmberJS 在路由中加载 ownTo/hasMany 关系

在我的 Ember JS 应用程序中，我显示了一个约会列表。在约会控制器的操作中，我需要获取约会所有者，但所有者始终返回“未定义”。

我的文件：

模型/appointment.js

import DS from 'ember-data';

export default DS.Model.extend({
    appointmentStatus: DS.attr('number'),
    owner: DS.hasMany('person'),
    date: DS.attr('Date')
});

模型/person.js

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string')
});

模板/约会列表.js

{{#each appointment in controller}}
    <div>
        {{appointment.date}} <button type="button" {{action 'doIt'}}>Do something!</button>
    </div>
{{/each }}

控制器/appointmentlist.js

export default Ember.ArrayController.extend({
    itemController: 'appointment'
});

控制器/appointment.js

export default Ember.ObjectController.extend({
    actions:{
        doIt: function(){
            var appointment = this.get('model');
            var owner = appointment.get('owner'); //returns undefined
            //Do something with owner
        }
    }
});

现在，我知道我可以将所有者财产更改为owner: DS.hasMany('person', {async: true})，然后处理从返回的承诺appointment.get('owner');，但这不是我想要的。 我发现如果我这样做{{appointment.owner}}或这个{{appointment.owner.name}}在约会列表模板中，所有者记录是从服务器获取的。所以我猜 Ember 不会加载关系，除非它们在模板中使用。

我认为解决我的问题的方法是使用appointmentlists 路由来获取belongsTo 关系中的记录。但我不知道怎么做。

也许是这样的？

路线/约会列表.js

export default Ember.Route.extend({
    model: function() {
        return this.store.find('appointment');
    },
    afterModel: function(appointments){
        //what to do
    }
});

EDIT

我这样做了：

路线/约会列表.js

export default Ember.Route.extend({
    model: function() {
        return this.store.find('appointment');
    },
    afterModel: function(appointments){
         $.each(appointments.content, function(i, appointment){

                var owner= appointment.get('owner')   
         });
    }
});

它有效，但我不喜欢这个解决方案......

您仍然异步加载这些记录，因此如果您足够快，您仍然可能会遇到未定义的情况。最好从 afterModel 挂钩返回一个承诺，或者只修改模型挂钩来完成这一切。

model: function() {
  return this.store.find('appointment').then(function(appointments){
    return Ember.RSVP.all(appointments.getEach('owner')).then(function(){
      return appointments;
    });
  });
}

or

model: function() {
  return this.store.find('appointment');
},
afterModel: function(model, transition){
  return Ember.RSVP.all(model.getEach('owner'));
}