一尘不染

EmberJS:如何在同一路线上加载多个模型?

javascript

虽然我对Web开发并不陌生,但对客户端MVC框架却不是很陌生。我做了一些研究,并决定尝试使用EmberJS。我浏览了TodoMVC指南,这对我来说很有意义。

我已经安装了一个非常基本的应用程序;索引路径,两个模型和一个模板。我正在运行服务器端的php脚本,该脚本返回一些数据库行。

让我感到困惑的一件事是如何在同一条路线上加载多个模型。我已经阅读了一些有关使用setupController的信息,但仍不清楚。在我的模板中,我有两个要与不相关的数据库行一起加载的表。在一个更传统的Web应用程序中,我将刚刚发布到sql语句并循环遍历它们以填充行。我很难将此概念转换为EmberJS。

如何在同一路径上加载不相关数据的多个模型?

我正在使用最新的Ember和Ember Data库。

更新资料

尽管第一个答案提供了一种处理它的方法,但是第二个答案说明了什么时候合适以及什么时候不合适的不同方法。


阅读 250

收藏
2020-04-25

共1个答案

一尘不染

您可以使用加载多个模型:

app/routes/index.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return Ember.RSVP.hash({
      people: this.store.findAll('person'),
      companies: this.store.findAll('company')
    });
  },

  setupController(controller, model) {
    this._super(...arguments);
    Ember.set(controller, 'people', model.people);
    Ember.set(controller, 'companies', model.companies);
  }
});

在您的模板中,您可以引用peoplecompanies获取加载的数据:

app/templates/index.js

<h2>People:</h2>
<ul>
  {{#each people as |person|}}
    <li>{{person.name}}</li>
  {{/each}}
</ul>
<h2>Companies:</h2>
<ul>
  {{#each companies as |company|}}
    <li>{{company.name}}</li>
  {{/each}}
</ul>
2020-04-25