Usiung a type instead of a header in flashmessages

This commit is contained in:
2023-02-12 16:16:49 +01:00
parent 97c758fa4f
commit d4e1acb4e5
2 changed files with 39 additions and 12 deletions

View File

@@ -1,5 +1,18 @@
<ngb-toast
*ngFor="let flashmessage of flashmessagesService.toasts"
[header]="flashmessage.header" [autohide]="true" [delay]="flashmessage.delay || 5000"
[header]="flashmessage.type" [autohide]="true" [delay]="flashmessage.delay || 1500"
(hiddden)="flashmessagesService.remove(flashmessage)"
>{{flashmessage.body}}</ngb-toast>
>
<ng-container [ngSwitch]="flashmessage.type">
<div *ngSwitchCase="'Success'" class="alert alert-success" role="alert">
{{flashmessage.body}}
</div>
<div *ngSwitchCase="'Info'" class="alert alert-primary" role="alert">
{{flashmessage.body}}
</div>
<div *ngSwitchCase="'Error'" class="alert alert-danger" role="alert">
{{flashmessage.body}}
</div>
</ng-container>
</ngb-toast>

View File

@@ -1,20 +1,34 @@
import {Injectable} from "@angular/core";
export interface Flashmessage {
header: string;
body: string;
delay?: number;
body: string;
delay?: number;
type: "Error"|"Success"|"Info";
}
@Injectable({ providedIn: 'root' })
export class FlashmessagesService {
toasts: Flashmessage[] = [];
toasts: Flashmessage[] = [];
show(header: string, body: string) {
this.toasts.push({ header, body });
}
success(body: string) {
this.show("Success", body);
}
remove(toast: Flashmessage) {
this.toasts = this.toasts.filter(t => t != toast);
}
error(body: string) {
this.show("Error", body);
}
show(type: string, body: string) {
if (type == "Success") {
this.toasts.push({ type, body });
} else if (type == "Error") {
this.toasts.push({ type, body });
} else {
this.toasts.push({ type: "Info", body });
}
}
remove(toast: Flashmessage) {
this.toasts = this.toasts.filter(t => t != toast);
}
}