ajax - Ember JS : How to load a second model based on data from a first

标签 ajax ember.js promise rsvp.js

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

我们能够使用 RSVP 一次加载两个模型 - 一个是通过我们的 API 包装器的 Project 对象,第二个是代表登录用户的对象。两者都被传递到 Controller 和模板中并且工作得很好。

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

一旦我像这样在我的 route 加载了模型......

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 函数和 Controller - 结果是正确的 API 调用,但它是异步的,因此 Ember 继续渲染页面,而我无法在页面上显示 API 调用的结果。

那么 - 如何以及在 Ember 结构中的何处加载基于第一个模型的数据的第二个模型?我怎样才能让 ember 等待第二个 AJAX 调用的已解决 promise ?

更新

我还尝试使用 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)
    });
}

最佳答案

链接 promise ,Ember 将获取最终结果(来自模型 Hook )

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

关于ajax - Ember JS : How to load a second model based on data from a first,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22865367/

相关文章:

php - while 循环中的 Ajax

jquery - 使用 jQuery 在 ajax 调用期间将参数附加到 url

javascript - React js map() undefined 不是一个函数

javascript - Ember JS : Error when setting a collection property which is bound to a view in IE only

javascript - 吞下消息 : Error: Uncaught (in promise): [object Undefined]

javascript - 如何 '$.all' 一组动态的 promise ?

javascript - 基于查询参数的可选 promise 步骤

javascript - 具有相同键的多个值的 jquery ajax 数据对象

ember.js - 过滤模型时,deleteRecord 不会更新 ArrayController

asp.net - 如何在 Ember.js 应用程序中使用 ASP .NET Web API 方法