File

src/module/components/dialogs/mat-confirm-dialog/mat-confirm-dialog.component.ts

Implements

OnInit

Metadata

selector mat-confirm-dialog
styleUrls ./mat-confirm-dialog.component.scss
templateUrl ./mat-confirm-dialog.component.html

Index

Properties
Methods

Constructor

constructor(dialogRef: MatDialogRef, data: MatConfirmDialogData)
Parameters :
Name Type Optional
dialogRef MatDialogRef<MatConfirmDialog> No
data MatConfirmDialogData No

Methods

ngOnInit
ngOnInit()
Returns : void

Properties

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

Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""