Ember.js v2在路由中加载多个模型，无需单独请求

刚刚开始使用Ember.js，所以在我自己在线阅读了几周的各种教程之后（…），我真的无法解决以下问题

我想在一条路线上显示4个模型。如何做到这一点，同时避免拨打4个服务器电话？

更多信息：

我想在我的索引页上显示“person”、“quote”、“product”和“case”类型的记录

在我的索引路由中（路由/index.js），我可以使用以下方式加载它们：

import Ember from "ember";

export default Ember.Route.extend({
  model(){
    return Ember.RSVP.hash({
      persons : this.get('store').findAll('person'),
      quotes  : this.get('store').findAll('quote'),
      cases   : this.get('store').findAll('case'),
      products: this.get('store').findAll('product')
    });
  }
});

（在我的适配器adapters/application.js中，我有：）

这非常有效：），但ember.js会发出4个请求：

但是，我可以很容易地提供一个JSON文件，该文件提供所有4种类型的记录

那么，我如何告诉ember.js：

“这是一个漂亮的大JSON文件，充满了记录。现在，只使用记录 人员模型的“人员”类型，以及“案例”的idem dito， “报价”和“产品”

---

？

嗯，您可能可以在适配器中实现这一点。这可以让您了解您可以做什么：

export default DS.JSONAPIAdapter.extend({
  init() {
    this._super(...arguments);
    this.set('toLoad', {});
  },

  loadDebounces() {
    const toLoad = this.get('toLoad');
    this.set('toLoad', {});
    const keys = Object.keys(toLoad);

    const data = magicLoadForAllAllKeys(); // just do something you like here. Sent the keys as POST, or GET array, websockets, smoke signals..
    Object.keys(data).forEach(key => {
      toLoad[key].resolve(data[key]);
    });
  },

  findAll (store, type, sinceToken, snapshotRecordArray)  {
    return new Ember.RSVP.Promise((resolve, reject) => {
      this.set(`toLoad.${type}`, { resolve, reject });
      Ember.run.debounce(this, this.loadDebounces, 1);
    });
  },
});

---

基本上，您可以将多个请求解装箱并作为一个请求进行处理。但是，这既不符合RESTFull，也不符合JSONAPI。仅此而已。

您可能可以在适配器中实现这一点。这可以让您了解您可以做些什么：

export default DS.JSONAPIAdapter.extend({
  init() {
    this._super(...arguments);
    this.set('toLoad', {});
  },

  loadDebounces() {
    const toLoad = this.get('toLoad');
    this.set('toLoad', {});
    const keys = Object.keys(toLoad);

    const data = magicLoadForAllAllKeys(); // just do something you like here. Sent the keys as POST, or GET array, websockets, smoke signals..
    Object.keys(data).forEach(key => {
      toLoad[key].resolve(data[key]);
    });
  },

  findAll (store, type, sinceToken, snapshotRecordArray)  {
    return new Ember.RSVP.Promise((resolve, reject) => {
      this.set(`toLoad.${type}`, { resolve, reject });
      Ember.run.debounce(this, this.loadDebounces, 1);
    });
  },
});

---

基本上可以只删除多个请求并将它们处理为一个。但是，这不是Resturn或JSONAPI兼容的。只是提到这个。

每个请求加载模型没有错误。如果模型是相关的，则应该考虑它们之间的定义。再次加载任何异步数据，它将进行网络请求。

如果你想为不同的模型类型在单个请求中加载数据，那么你可以尝试下面的方法，这不是ember数据方式。所以我不鼓励这样做

import Ember from "ember";

const {RSVP} = Ember;

export default Ember.Route.extend({
  model() {
    return RSVP
      .resolve(Ember.$.getJSON('http://localhost:8080/dummy.php'))
      .then((result) => {
        this.get('store').pushPayload(result);
        return {
          persons : this.get('store').peekAll('person'),
          quotes  : this.get('store').peekAll('quote'),
          cases   : this.get('store').peekAll('case'),
          products: this.get('store').peekAll('product')
        };
      });
  }
});

---

在每个请求中加载模型没有错误。如果模型是相关的，则应该考虑它们之间的定义。再次加载任何异步数据，它将进行网络请求。

如果你想为不同的模型类型在单个请求中加载数据，那么你可以尝试下面的方法，这不是ember数据方式。所以我不鼓励这样做

import Ember from "ember";

const {RSVP} = Ember;

export default Ember.Route.extend({
  model() {
    return RSVP
      .resolve(Ember.$.getJSON('http://localhost:8080/dummy.php'))
      .then((result) => {
        this.get('store').pushPayload(result);
        return {
          persons : this.get('store').peekAll('person'),
          quotes  : this.get('store').peekAll('quote'),
          cases   : this.get('store').peekAll('case'),
          products: this.get('store').peekAll('product')
        };
      });
  }
});

---

您可以输入数据。@Lux谢谢。即使这4个不同（种类）的记录不相关？例如，在我的情况下，这些人不是作者。嗯..您实际上发出了4个请求。您应该在后端创建一个端点，为类型获取多个值（发送一个类型数组）它会发回这个包含多种数据类型的大json，然后您必须使用适配器/序列化程序来处理response@MilkyWayJoe谢谢。现在我知道在哪里可以看得更远了…@Ideogram我一生中没有做过多少php，但是我想找一个JSON API兼容的序列化程序。它应该以不同的方式解决其中一些问题，这就是可重新管理您可以重新管理数据。@谢谢。即使这4条不同（种类）的记录不相关？例如，在我的情况下，这些人不是作者。嗯..您实际上提出了4个请求。您应该在后端创建一个端点，为类型获取多个值（发送一个类型数组）它会发回这个包含多种数据类型的大json，然后您必须使用适配器/序列化程序来处理response@MilkyWayJoe谢谢。现在我知道在哪里可以看得更远了…@Ideogram我一生中没有做过多少php，但是我想找一个JSON API兼容的序列化程序。它应该以不同的方式解决其中一些问题，这就是重新管理我越是调查这个问题，我就越觉得你的第一句话是至关重要的，是真正的答案。我很想把它标记为答案，但我无法让它工作。（我真的试过了）。我不断在控制台中发现一个错误：this.get（…）。pushPayLoad不是一个函数。（另外，我需要添加“Ember”在$和一个额外的半列之前，使jslint停止模糊。）哦，对不起，这不是

pushPayLoad

小写vs.大写，…哦，我的…：）相应地编辑了你的答案。我越是调查这个问题，我越觉得你的第一句话至关重要，而且是真正的答案。我很想把它标记为答案，但我无法让它工作。（我真的尝试了）。我一直在控制台中收到一个错误：this.get（…）。pushPayLoad不是一个函数。（此外，我需要在$前面添加“Ember”和一个额外的半列，以使jslint停止模糊。）哦，很抱歉，这不是

pushPayLoad

小写与大写的对比，…哦，我的…）相应地编辑了您的答案。