Sub-Routing (Angular): Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
| Zeile 53: | Zeile 53: | ||
<pre> | <pre> | ||
<div *ngFor="let tab of tabs" class="tab-item"> | <div *ngFor="let tab of tabs" class="tab-item"> | ||
<a [routerLink]="[' | <a [routerLink]="['/main', {outlets: {'sub': [tab.target]}}]" routerLinkActive="active">{{tab.label}}</a> | ||
</div> | </div> | ||
</pre> | </pre> | ||
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]="['/main', {outlets: {'sub': [tab.target]}}]" routerLinkActive="active">{{tab.label}}</a>
</div>
Zurück zu Angular