如何在EmberJS路由中加载belongsTo / hasMany关系 [英] How to load belongsTo/hasMany relationships in route with EmberJS

问题描述

在我的EmberJS应用程序中，我正在显示一个约会列表。在AppointmentController中的一个动作中，我需要得到约会所有者，但是所有者总是返回undefined。

In my EmberJS application I am displaying a list of Appointments. In an action in the AppointmentController I need to get the appointments owner, but the owner always returns "undefined".

我的文件：

模型/约会

import DS from 'ember-data';

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

models / person.js

import DS from 'ember-data';

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

templates /约会列表

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

controllers /约会列表

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

controllers / 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
        }
    }
});

现在，我知道我可以将所有者属性更改为所有者：DS .hasMany（'person'，{async：true}），然后处理从 dating.get（'owner'）返回的承诺; ，但这不是我想要的。
我已经发现，如果我这样做 {{约会所有者}} 或这个 {{约会的所有者名}} / code>在约会列表模板中，从服务器获取所有者记录。所以我猜Ember没有加载关系，除非它们在模板中使用。

Now, I know I can change the owner-property to owner: DS.hasMany('person', {async: true}), and then handle the promise returned from appointment.get('owner');, but that is not what I want. I have discovered that if I do this {{appointment.owner}} or this {{appointment.owner.name}} in the appointmentlist template, the owner record is fetched from the server. So I guess Ember does not load relationships unless they are used in the template.

我认为我的问题的解决方案是使用约会列表路由获取记录属于关系。但是我不知道如何。

I think that the solution to my problem is to use the appointmentlists route to fetch the record in the belongsTo relationship. But I can't figure out how.

可能这样吗？

路线/约会列表.js

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

编辑

我这样做：

routes /约会列表

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')   
         });
    }
});

它的工作原理，但我不喜欢解决方案...

and it works, but I do not like the solution...

推荐答案

你仍然异步加载这些记录，所以如果你足够快，你仍然可以得到未定义的。最好从afterModel钩子返回一个承诺，或者只是修改模型钩来完成所有这些。

You are still asynchronously loading those records, so if you are fast enough you could still get undefined. It'd be better to return a promise from the afterModel hook, or just modify the model hook to do it all.

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

或

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

这篇关于如何在EmberJS路由中加载belongsTo / hasMany关系的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！