如何在angular中的路由器之一中显示数据？

Question

我在主要组件中设计了路由器：

<div class="main-panel">
    <app-navbar></app-navbar>
    <router-outlet></router-outlet>
    <app-footer></app-footer>
</div>

在app-navbar中有一个search box，搜索结果显示在router-outlet的一个组件上。问题是我不知道如何将数据从导航栏组件传递到路由器出口。

我什至尝试导入组件，但路由器出口无法自动刷新布尔值已更改。

Answer 1

一种选择是构建服务。 [我在我的原始答案中提供了其他几个选项......但它已被版主删除，所以我将这些其他选项关闭。]

我制作了一个 stackblitz 演示如何在这个特定场景中使用服务：https://stackblitz.com/edit/angular-simpleservice-deborahk

注意：它不需要 Subject 或订阅

它提供了一个 "header" 组件，类似于带有搜索框的 <app-navbar></app-navbar>。还有一个 <router-outlet> 和一个显示搜索结果的组件。（虽然我的具体示例只显示了搜索文本......它可以很容易地扩展为使用该搜索文本来显示搜索结果。）

希望对您有所帮助！

如何在angular中的路由器之一中显示数据？

How to display the data in the one of router in angular?

router-outlet

angular