Sub-Routing (Angular): Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Zeile 28: | Zeile 28: | ||
}, | }, | ||
{ | { | ||
path: ' | path: 'subtarget2', | ||
component: | component: SubTarget2Component, | ||
outlet: 'sub' | outlet: 'sub' | ||
} | } | ||
Zeile 41: | Zeile 41: | ||
}) | }) | ||
export class TestRoutingModule { } | export class TestRoutingModule { } | ||
</pre> | |||
== Router-Outlet == | |||
<pre> | |||
</pre> | |||
== Router-Links == | |||
<pre> | |||
<div *ngFor="let tab of tabs" class="tab-item"> | |||
<a [routerLink]="['/search/main', {outlets: {'sub': [tab.target]}}]" routerLinkActive="active">{{tab.label}}</a> | |||
</div> | |||
</pre> | </pre> | ||
Zurück zu [[Angular#Routing|Angular]] | Zurück zu [[Angular#Routing|Angular]] |
Version vom 30. November 2018, 12:01 Uhr
Noch in Bearbeitung
Sub-Route anlegen
import ... const routes: Routes = [ { path: '', redirectTo: 'main', pathMatch: 'full' }, { path: 'main', component: MainComponent, children: [ { path: '', redirectTo: 'subtarget1', pathMatch: 'full' }, { path: 'subtarget1', component: SubTarget1Component, outlet: 'sub' }, { path: 'subtarget2', component: SubTarget2Component, outlet: 'sub' } ] } ]; @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule] }) export class TestRoutingModule { }
Router-Outlet
Router-Links
<div *ngFor="let tab of tabs" class="tab-item"> <a [routerLink]="['/search/main', {outlets: {'sub': [tab.target]}}]" routerLinkActive="active">{{tab.label}}</a> </div>
Zurück zu Angular