Angular2: load component in router-outlet by name

1

I'm doing a dynamic tab in Angular 2

<ul class="nav nav-tabs"> <li *ngFor="let tab of ltTabsMenu"> <a data-toggle="tab" href="#{{tab.idDiv}}">{{tab.title}}</a> </li> </ul>

Later I generate the div by another ngFor:

<div *ngFor="let tab of ltTabsMenu" id="{{tab.idDiv}}" class="tab-pane fade fill"> <router-outlet name="tab.OutletName"></router-outlet> </div>

Once this is done I need to load a component in the router-outlet with the name that I indicate, I have tried with the following but nothing:

let navigationExtras: any = {
 outlets: { 'nombre_outlet': ['none'] }

};

this._router.navigate (['counter'], navigationExtras);

In short, what I need is to generate a dynamic tab and when the user is positioned on a tab load a component in an independent div, since the user can open several tabs and navigate between them without losing information.

How can I solve it?

Thank you very much

    
asked by Daniel López 11.05.2017 в 17:53
source

0 answers