angular - 如何在 Angular2 的路由器导出中发出事件

Question

我有主要的 appComponent

<div class="appComponent">
<div class="row nav navbar">
    <div class="col-sm-8 text-left nav logo">Manacola</div>
    <button class="col-sm-1  col-sm-offset-1  btn btn-primary openGraph" (click)="openGraph()">Graph</button>
    <button class="col-sm-1   btn btn-primary openGraph" *ngIf="loggedIn" (click)="logout()">Logout</button>
</div>
<router-outlet ></router-outlet>

我想从另一个登录组件发出数据。重点是，当我在 loginComponent 中按下“登录”按钮时，我希望在 appComponent 中将 *ngIf="loggedIn" 设置为“true” .有这样的工作会很好:

<router-outlet (isLogged) = 'loggedIn = $event' ></router-outlet>   

Answer 1

您可以在路由器导出处渲染的组件中定义一个@Output 事件发射器。定义路由器导出如下。

*.html
<router-outlet (activate)="onActivate($event)"></router-outlet>

在您的组件中，您可以这样做。

onActivate(elementRef) {
    elementRef.<the @Output eventEmitter>.subscribe(event => {
        console.log(event);
    });
}

通过这种方式，您可以将事件发送到正在渲染路由器导出的组件。这是可行的，因为@Output 事件发射器是事件流，您可以订阅这些事件。