角2通點擊從路由出口app.component

Question

我新的角度2和創建應用程序

app.routing.ts

const appRoutes: Routes = [ 
    {path:'', component:HomeComponent}, 
    { path: 'login', component: LoginComponent }, 
     { path: 'register', component: RegisterComponent }, 

    // otherwise redirect to home 
    { path: '**', redirectTo: '' } 
]; 

app.component.html

<app-navbar (sideMenuToggleClicked)="handleSideMenuToggle()"></app-navbar> 
<div class="container-fluid"> 
    <div class="row"> 
     <div class="col col-sm-2 test-border" *ngIf="sideBarToggle"> 
      <h1> 
       {{sideBarToggle }} 
      </h1> 
     </div> 
     <div class="col col-10 test-border" [ngClass]="sideBarToggle?'col-10':'col-12'"> 
      <app-alert *ngIf="showAlert"></app-alert> 
      <router-outlet (showAlert)="handleShowAlert($event)"></router-outlet> 
     </div> 
    </div> 
</div> 

register.component.ts

正如您所看到的，我成功捕獲了作爲組件加載的app-navbar中的單擊。

現在我想創建一個共同的警報通知，當我與

<router-outlet (showAlert)="handleShowAlert($event)"></router-outlet> 

試試我是不是能夠捕捉到EventEmitter點擊。

的問題是如何從register.component.html轉移射向app.component.html

Answer 1

它不會工作像你想，它會嘗試尋找showAlert上RouterOutlet指令，它也不會找到。

您需要檢查如何Parent and children communicate via a service。

希望這有助於！