“Auxilary Route” Code-Antworten

Auxilary Route

//in app-routing.module.ts-
{path:'showMessage' , component:WelcomeComponent , outlet:'showMessage'},

//in html-
<li><a [routerLink]="[{outlets:{showMessage : ['showMessage']}}]"  >Show Messages</a></li>


<div class="col-md-3" >
        <router-outlet name="showMessage" ></router-outlet>
</div>
      

//to close auxilary route-
close(){
    this.route.navigate([{outlets:{showMessage:null}}]);
}

//to navigate to auxilary route through ts-
click(){
    this.route.navigate([{outlets:{showMessage:['showMessage']}}]);
}