Question

我正在尝试从2个类别（新闻和事件）中获取两个2个博客帖子列表，然后将其显示在我的主页的2个不同列中。我需要执行2个单独的Ajax调用来获取这些博客帖子。我没有使用ember-data进行此操作，因为我没有看到在这种情况下使用它的优势（但我可能错了）。

export default Ember.Route.extend({
  setupController(controller, model) {
    var wpUrl = 'http://public-api.wordpress.com/rest/v1/sites/company.wordpress.com/posts/?number=2&category=';

    Ember.$.ajax({ url: wpUrl + 'news', dataType: "jsonp", type: 'GET' }).then(function (data) {
      controller.set('news', data.posts);
    });
    Ember.$.ajax({ url: wpUrl + 'events', dataType: "jsonp", type: 'GET' }).then(function (data) {
      controller.set('events', data.posts);
    });
  }
});

以上代码有效。但是根据我在Ember纪录片中所读到的内容，我应该在model钩子（而不是setupController）中获取这些数据以利用承诺。所以我试着用这种方式重新编写代码：

export default Ember.Route.extend({
  model() {
    var wpUrl = 'http://public-api.wordpress.com/rest/v1/sites/company.wordpress.com/posts/?number=2&category=';

    return {
      news: function () {
        return Ember.$.ajax({ url: wpUrl + 'news', dataType: "jsonp", type: 'GET' }).then(function (data) {
          return data.posts;
        })
      },
      events: function () {
        return Ember.$.ajax({ url: wpUrl + 'events', dataType: "jsonp", type: 'GET' }).then(function (data) {
          return data.posts;
        })
      }
    };
  }
});

但这不起作用。在页面渲染之后，Ajax调用已经完成，但为时已晚。我不确定我做错了什么。在这种情况下使用ember-data会有什么好处吗？

Answer 1

您可以使用RSVP.hash()

返回Promises的哈希值

你可以这样做：

export default Ember.Route.extend({
    model() {
        var wpUrl = 'http://public-api.wordpress.com/rest/v1/sites/company.wordpress.com/posts/?number=2&category=';

        return new Ember.RSVP.hash({
            news: Ember.$.ajax({ url: wpUrl + 'news', dataType: "jsonp", type: 'GET' }),
            events: Ember.$.ajax({ url: wpUrl + 'events', dataType: "jsonp", type: 'GET' })
        });
    }
});

在Ember here

中详细了解承诺

Answer 2

您返回一个包含两个promise的对象，而不是一个实际的promise。你需要的是建立你自己的承诺（Ember.RSVP.Promise），一旦两个内部承诺解决，它将被解决。

如何在一个路由中进行多个ajax调用？

2 个答案: