Angular 2中的不同模块组件通信

Question

我有一个组件，我希望它将数据传递给另一个模块中的另一个组件。实际上我的app.component是这些儿童模块的父母。我希望每个子模块都将一些数据发送到app.component。但他们只是一个路由的孩子和父母。我猜他们实际上并不是父母和孩子。

我的意思是，我的app.component模板看起来像这样：

  <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav navbar-left">
      <li><a routerLink="link1" routerLinkActive="active">Page1</a></li>
      <li><a routerLink="link2" routerLinkActive="active">Page2</a></li>
      <li><a routerLink="link3" routerLinkActive="active">Page3</a></li>
      <li><a routerLink="link4" routerLinkActive="active">Page4</a></li>
    </ul>
  </div>
</nav>
<div *ngIf="needsSidebar" id="sidebar">some content</div>
<div>
  <router-outlet></router-outlet>
</div>

所以app.component与这些模块及其组件没有直接联系。我试图使用Output，但由于组件来自不同的模块，它失败了。我迷失了，我应该怎么做。我希望我的“儿童”模块将数据发送到app.module，告诉它是否需要侧边栏以及哪些内容应该侧边栏显示。我该怎么做？

Answer 1

模块是如何相关的并不重要。重要的是，如果组件是组件视图中的子组件。在这种情况下，您可以使用Angulars绑定语法。在其他情况下使用共享服务。有关详细信息，请参阅https://angular.io/docs/ts/latest/cookbook/component-communication.html

同样重要的是，您将共享服务添加为提供者。如果将其添加到组件，则只有此组件的实例及其子项和子项共享此服务实例。如果向@NgModule()的提供者添加服务，则会与整个应用程序共享一个实例（对于非延迟加载的模块）。

Answer 2

对于这种情况，您可以查看sharedModule。 SharedModule与您希望在不同模块/组件中使用的services,pipes & etc共享。