html - 使用路由器插座活动事件获取子组件实例时子组件未显示

Question

在使用路由器插座时，我使用了“<strong>active”事件来获取子组件实例。

每当实例化新组件时，路由器出口都会发出激活事件，并在销毁组件时发出停用事件。

示例- https://stackblitz.com/edit/angular-router-basic-example-a9jpsd?file=app/app.component.ts

示例代码——</p>

App.component.html

<div class="container">
    <router-outlet (activate)="onActivate($event)"></router-outlet>
  </div>

应用组件.ts

public onRouterOutletActivate(event : any) {
    console.log(event);
}

但是子组件在初始加载时不会显示，但元素在 DOM 中。

关于这个问题的任何想法？

Answer 1

返回 (activate) 正在寻找的布尔值：

public onRouterOutletActivate(event : any) {
    if(event){
      console.log(event);
      return true;
    }else{ return false; }
}

如果您在 (activate) 上调用相同的 onRouterOutletActivate 函数，也只需检查 app.component.html：

(activate)="onRouterOutletActivate($event)"

希望它现在对你有用！