File
Metadata
styles |
mat-card {margin: 10px;},.root-frame {padding: 80px;} |
templateUrl |
./route-dispatcher.component.html |
Constructor
constructor(router: Router)
|
|
Parameters :
Name |
Type |
Optional |
router |
Router
|
No
|
|
url
|
Type : string
|
Default value : ''
|
|
import { Component } from '@angular/core';
import { Router, RouterState, RouterStateSnapshot } from '@angular/router';
@Component({
templateUrl: './route-dispatcher.component.html',
styles: [
'mat-card {margin: 10px;}',
'.root-frame {padding: 80px;}'
]
})
export class RouteDispatcherComponent {
url = '';
constructor(
private router: Router
) {
const state: RouterState = router.routerState;
const snapshot: RouterStateSnapshot = state.snapshot;
this.url = snapshot.url;
}
}
<div class="root-frame" fxLayout="row wrap" fxLayoutAlign="center stretch">
<mat-card fxFlex="0 0 400px" fxLayout="column">
<mat-card-title>Diese Seite wurde nicht gefunden.</mat-card-title>
<mat-card-content>
<div style="{margin: 50px;}">
{{url}}
</div>
</mat-card-content>
<mat-card-actions>
<button [routerLink]="['/']" mat-raised-button color="primary">Zur Startseite</button>
</mat-card-actions>
</mat-card>
</div>
mat-card {margin: 10px;}
.root-frame {padding: 80px;}
Legend
Html element with directive