File

src/lib/confirm-dialog/confirm-dialog.component.ts

Metadata

Index

Properties

Constructor

constructor(data: ConfirmDialogData)
Parameters :
Name Type Optional
data ConfirmDialogData No

Properties

Public Readonly action
Type : string
Public Readonly data
Type : ConfirmDialogData
import {
  ChangeDetectionStrategy,
  Component,
  Inject,
} from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import {
  MAT_DIALOG_DATA,
  MatDialogModule,
} from '@angular/material/dialog';
import { SantizationPipe } from '@rxap/pipes/santization';

export interface ConfirmDialogData {
  message: string;
  action?: string;
}

@Component({
    selector: 'rxap-confirm-dialog',
    templateUrl: './confirm-dialog.component.html',
    styleUrls: ['./confirm-dialog.component.scss'],
    changeDetection: ChangeDetectionStrategy.OnPush,
    imports: [MatDialogModule, MatButtonModule, SantizationPipe]
})
export class ConfirmDialogComponent {

  public readonly action: string;
  public readonly data: ConfirmDialogData;


  constructor(
    @Inject(MAT_DIALOG_DATA)
      data: ConfirmDialogData,
  ) {
    this.data = data;
    this.action = this.data.action ?? 'OK';
  }

}
<h2 i18n mat-dialog-title>Confirm</h2>
<mat-dialog-content>

  <div [innerHtml]="data.message | santization:'html'" class="content"></div>

</mat-dialog-content>
<mat-dialog-actions>
  <button [mat-dialog-close]="false" i18n mat-button>Cancel</button>
  <button [mat-dialog-close]="true" color="accent" mat-raised-button>{{ action }}</button>
</mat-dialog-actions>

./confirm-dialog.component.scss

.content {
  padding: 16px;
  max-height: 80vh;
  overflow-y: auto;
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""