ember.js - 如何在不同的路由上连接两个组件？

Question

我有一个需要互动的父组件和子组件。通常我会使用contextual components。在这种情况下，这不起作用，因为这两个组件不在同一路由模板上。父组件位于一条路线上，子组件位于子路径上，据我所知，我无法将上下文组件传递给{{outlet}}。

Route       | Component
----------------------------
route       | parentComponent
route.sub   | childComponent

我目前看到两个选项：

1. 将父组件逻辑移至控制器
2. 使用服务

我想避免这两个选项，因为相同的父子组件可能同时显示两次。在这两种情况下，我都没有看到使用某种ID将正确的子节点与正确的父节点连接的其他选项，我不喜欢这样，因为我发现很难调试和阅读。

       Controller/Service
        ∧              |
        |              ∨
      action()      ?  or  ?  -> use of ID
        ∧           |      |
        |           ∨      ∨
child child       parent parent

还有其他办法吗？ 谢谢你的帮助！

Answer 1

简短的回答是，如果不使用您提供的两个选项，则无法实施解决方案。

我相信你提到的部分没有表现出适当的亲子关系，因为父母住在一个根，孩子住在另一条路上。

假设TemplateA - 具有{{comp-a}}和{{comp-b}} - 这称为兄弟组件。这里comp-b无法与comp-a进行通信，但可以通过向共同控制器/路由发送操作来实现。

假设TemplateA - 有{{comp-a }}且comp-a内有{{comp-b}} - 这称为父子组件，此处子组件（comp-b）可以与父组件{ {1}}。

组件将通过冒泡操作进行通信，并且应在数据的源/所有者中实现操作逻辑。

在您的情况下，答案取决于谁是数据的所有者，

1.如果组件未在相同的嵌套路由层次结构中使用，那么我更愿意将数据所有权提供给服务 2.如果两个组件都在相同的嵌套路由层次结构中使用，那么我更愿意将数据所有权赋予控制器/路由 即，
父路线 - ＆gt;将加载数据并将所需数据传递给父组件 parent-route.sub - ＆gt;从父路由获取子组件所需的数据（您可以使用comp-a modelFor方法）并传递子组件。现在，子组件可以从此处触发操作直到应用程序路由进行通信。