如何从根组件到<router-outlet>中的另一个组件调用函数

Question

我有一个标头组件，它被注入到app.component.html中（我希望将其修复）。所有其他组件都在<router outlet>中定义。每个组件都有一个函数showData()，当日期（在标题组件中）更改时应调用该函数。我该如何实现？我必须使用ActivatedRout配置吗？

app.component.html

<app-header></app-header> <router-outlet></router-outlet>

Answer 1

您可以使用此：

<router-outlet (activate)="onRouterOutletActivate($event)"></router-outlet>

activeComponent: any;

onRouterOutletActivate(component: any) {
    this.activeComponent = component;
}

dateChangedEvent() {
    this.activeComponent.showData();
}