Ember JS:如何基于第一个数据加载第二个模型

时间:2014-04-04 14:19:14

标签: ajax ember.js promise rsvp.js

我有一个Ember应用程序,而不是使用Ember Data,使用我们自己的自定义AJAX数据层来与API通信。

我们可以使用RSVP一次加载两个模型 - 一个是通过我们的API包装器的Project对象,第二个是表示登录用户的对象。两者都传递到控制器和模板中,并且运行正常。

但是我需要根据返回的Project对象中的值加载第二个模型。

一旦我在我的路线中加载了一个模型......

App.ProjectUpdateRoute = Ember.Route.extend({

    setupController: function(controller, model) {
        controller.set('model', model);
    },

    model: function(params) {

        return Ember.RSVP.hash({
            // Load Project from API - /myapi/v1/Project/:ProjectID
            Project : App.Project.create().findById(params.ProjectID),
            // Load current user from local object
            User : App.AuthUser,
        });
    },
});

...我有一个Project对象(或更确切地说是model.Project),其中包含各种属性,包括拥有该项目的用户的ID。

现在,我想对/myapi/v1/User/:UserID进行第二次API调用,以获取用户的详细信息。

我尝试过的所有内容 - 包括在路由的App.User.create().findById(UserID)函数和控制器中添加更多setupController次调用 - 都会产生正确的API调用,但它已经过了asyncronous,所以Ember继续呈现页面,我无法在页面上显示API调用的结果。

那么 - 如何以及在Ember结构中,我根据第一个数据加载第二个模型?我如何让ember等待第二次AJAX调用的解决承诺?

更新

我也尝试过使用afterModel:function(),这几乎就是我需要的 - 它会在应用流程中的正确位置进行第二次API调用,但我仍然需要将结果添加到我现有的model数组中:

afterModel: function(model, tranistion, params) {

    // Returns the promise but doesn't update 'model'
    return Ember.RSVP.hash({
        ProjectOwner : App.User.create().findById(model.Project.UserID)
    });
}

1 个答案:

答案 0 :(得分:6)

将承诺链接起来,Ember将采取最终结果(来自模型钩子)

model: function(params) {

  return Ember.RSVP.hash({
      // Load Project from API - /myapi/v1/Project/:ProjectID
      Project : App.Project.create().findById(params.ProjectID),
      // Load current user from local object
      User : App.AuthUser,
    }).then(function(results){
      return App.User.create().findById(results.Project.UserID).then(function(user){
        results.projectUser = user;
        return results;
      });
    });
},