File

src/app/app-root/route-dispatcher/route-dispatcher.component.ts

Metadata

styles mat-card {margin: 10px;},.root-frame {padding: 80px;}
templateUrl ./route-dispatcher.component.html

Index

Properties

Constructor

constructor(router: Router)
Parameters :
Name Type Optional
router Router No

Properties

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
Component
Html element with directive

result-matching ""

    No results matching ""