File
Implements
Metadata
| selector |
app-error-screen |
| styleUrls |
error-screen.component.css |
| templateUrl |
./error-screen.component.html |
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { ErrorStore } from '../stores';
@Component({
selector: 'app-error-screen',
templateUrl: './error-screen.component.html',
styleUrls: ['./error-screen.component.css']
})
export class ErrorScreenComponent implements OnInit {
constructor(public store: ErrorStore, private router: Router) {}
ngOnInit(): void {
if (this.store.errors === null || this.store.errors === undefined || this.store.errors.length === 0) {
this.router.navigate(['/start']);
}
}
ok() {
this.store.reset();
this.router.navigate(['/start']);
}
}
<div id="errorScreen" class="empty-page-ctn">
<i *ngIf="store.errors && store.errors.length > 0" class="material-icons status-negative">error_outline</i>
<h3 *ngIf="store.errors && store.errors.length > 0" class="status-header status-negative">
Encountered Errors:
</h3>
<div class="page-description" *ngFor="let error of store.errors">
<p class="error-title">{{ error.title }}</p>
<p class="error-message">{{ error.message }}</p>
</div>
<div>
<button id="okButton" (click)="ok()" type="button" class="action-button">
<p *ngIf="store.errors && store.errors.length > 0" class="button-inside">Ok</p>
<p *ngIf="!store.errors || store.errors.length === 0" class="button-inside">Home</p>
</button>
</div>
</div>
Legend
Html element with directive