EmberJS：如何在相同路线上加载多个模型？-JavaScript中文网-JavaScript教程资源分享门户

EmberJS 是一款流行的前端框架，它提供了许多强大的功能，包括路由和模型。在某些情况下，我们需要在同一个路由下加载多个模型，本文将介绍如何使用 EmberJS 实现这个功能。

背景

假设我们正在开发一个电子商务网站，其中有一个页面需要同时显示用户购物车和相关产品信息。这意味着我们需要在同一个路由中加载两个模型，即 cart 和 products。那么，如何实现这个功能呢？

解决方案

在 EmberJS 中，我们可以使用 model() 方法来加载模型。默认情况下，model() 方法只会加载一个模型，但是我们可以通过重写该方法并返回一个对象来加载多个模型。

下面是一个示例代码：

------ ----- ---- -----------------------

------ ------- ----- --------- ------- ----- -
  ------- -
    ------ -
      ----- ----------------------------- ---
      --------- -----------------------------
    --
  -
-

在上面的代码中，我们重写了 model() 方法，并返回了一个包含两个模型的对象。其中，cart 模型是通过 findRecord() 方法获取的，而 products 模型则是通过 findAll() 方法获取的。

一旦我们在路由中加载了这两个模型，我们就可以在模板中使用它们了。下面是一个示例模板：

------ ---------

----- -------------
  ------- ----------
  ----
    ------- ----------------- -- --------
      ----------------- ---------------------
    ---------
  -----
--------
  ------- ---- -- ----------
-------

----- -----------------
  ---------- -------------
  ----
    ------- --------------- -- -----------
      -------------------- ------------------------
    ---------
  -----
-------

在上面的模板中，我们通过 @model 属性访问了路由中加载的两个模型，并将它们显示在页面上。

结论

在 EmberJS 中，在同一个路由中加载多个模型非常容易。我们只需要重写 model() 方法并返回一个包含多个模型的对象即可。这种方法不仅可以提高代码的复用性和可读性，还可以优化数据的加载效率。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/12404