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

Question

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

每当有新组件时，路由器插座都会发出激活事件 正在被实例化，并且当它被实例化时是一个停用事件 销毁。

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

示例代码——

App.component.html

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

App.component.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)"

希望它现在对你有用！！！