src/module/components/dialogs/mat-confirm-dialog/mat-confirm-dialog.component.ts
selector | mat-confirm-dialog |
styleUrls | ./mat-confirm-dialog.component.scss |
templateUrl | ./mat-confirm-dialog.component.html |
Properties |
|
Methods |
constructor(dialogRef: MatDialogRef
|
|||||||||
Parameters :
|
ngOnInit |
ngOnInit()
|
Returns :
void
|
cancelTextButton |
Type : string
|
confirmMessage |
Type : string
|
confirmTextButton |
Type : string
|
Public data |
Type : MatConfirmDialogData
|
Decorators :
@Inject(MAT_DIALOG_DATA)
|
Public dialogRef |
Type : MatDialogRef<MatConfirmDialog>
|
title |
Type : string
|
import {Component, Inject, OnInit} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material';
export interface MatConfirmDialogData {
title?: string;
confirmMessage: string;
confirmTextButton?: string;
cancelTextButton?: string;
}
@Component({
selector: 'mat-confirm-dialog',
templateUrl: './mat-confirm-dialog.component.html',
styleUrls: ['./mat-confirm-dialog.component.scss']
})
export class MatConfirmDialog implements OnInit {
title: string;
confirmMessage: string;
confirmTextButton: string;
cancelTextButton: string;
constructor(public dialogRef: MatDialogRef<MatConfirmDialog>,
@Inject(MAT_DIALOG_DATA) public data: MatConfirmDialogData) {
}
ngOnInit() {
if (this.data) {
this.title = this.data.title ? this.data.title : 'Confirm';
this.confirmMessage = this.data.confirmMessage ? this.data.confirmMessage : 'Are you sure ?';
this.confirmTextButton = this.data.confirmTextButton ? this.data.confirmTextButton : 'Confirm';
this.cancelTextButton = this.data.cancelTextButton ? this.data.cancelTextButton : 'Cancel';
}
}
}
<h1 matDialogTitle>{{title}}</h1>
<div mat-dialog-content>{{confirmMessage}}</div>
<div mat-dialog-actions class="pt-24">
<button mat-raised-button class="mat-accent mr-16" (click)="dialogRef.close(true)">{{confirmTextButton}}</button>
<button mat-button (click)="dialogRef.close(false)">{{cancelTextButton}}</button>
</div>
./mat-confirm-dialog.component.scss