¿Puedo colocar una router-outlet secundaria en cualquier otro componente que no sea AppComponent ? Porque actualmente, cuando hago esto y trato de activarlo usando un [routlerLink] , aparece un error en la consola quejándose de que no puede encontrar una salida llamada popup. Si lo muevo de nuevo a AppComponent , ¡funciona!
Así que aquí está la estructura de mi proyecto:
app/ ├──auth/ │ └──login/ │ └──login.component.ts/html/scss ├──landing/ │ ├──landing.module.ts │ ├──landing.routing.ts │ └──landing.component.ts/html/scss ├──app.module.ts ├──app.routing.ts └──app.component.ts/html/scssY aquí está el código relevante (landing.routing/landing.component.html):
const routes: Routes = [{ path: '', component: LandingComponent, children: [{ path: 'login', component: LoginComponent, outlet: 'popup' }] }]; <p> <a [routerLink]="[{ outlets: { popup: ['login'] } }]">Login</a> </p> <router-outlet></router-outlet> <router-outlet name="popup"></router-outlet>... y finalmente las rutas app.routing.ts:
const routes: Routes = [ { path: 'landing', loadChildren: 'app/landing/landing.module#LandingModule' }, { path: '', component: HomepageComponent, canActivate: [AuthGuard] }, { path: '**', component: NotFoundComponent } ];