从内部更改路由器出口的内容

Question

我的app.component.html中有这样的html：

<login-menu></login-menu>
<top-menu-bar></top-menu-bar>

<div class="grid-container">
  <router-outlet></router-outlet>
</div>

您可以看到它很简单。顶部菜单栏将组件注入路由器插座。如何使注入的组件可以更改此路由器出口标签的内容？假设我要使注入的组件具有以下内容：

<a (click)="showPersonalProfile('1')" >{{person.name}}</a>

，然后单击“父组件路由器出口”。我尝试通过EventEmitter进行此操作，但失败了。有人有解决这个问题的例子吗？

Answer 1

router-outlet是一个占位符，用于显示与路由模块中定义的特定路由匹配的任何组件。

通过更改路线，我们可以控制替换路由器出口的哪个组件的应用选择器。

因此，要回答问题如何使注入的组件可以更改路由器出口标签的内容？，我们可以通过使用router.navigate（[ showPersonalProfile（）方法中的' path ']。

Answer 2

在该函数调用中，路由器导航并设置所需的url的主要路径，如下所示

router.navigate([{outlets: {primary: 'path'}}]);