angular-material-app documentation
  1. Components
  2. ConfirmComponent

File

src/app/component/dialog/confirm/confirm.component.ts

Metadata

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

Index

Properties
Methods

Constructor

constructor(dialogRef: MatDialogRef)
Defined in src/app/component/dialog/confirm/confirm.component.ts:19
Parameters :
Name Type Optional
dialogRef MatDialogRef<ConfirmComponent> No

Methods

accept
accept()
Defined in src/app/component/dialog/confirm/confirm.component.ts:27
Returns : void
cancel
cancel()
Defined in src/app/component/dialog/confirm/confirm.component.ts:23
Returns : void

Properties

acceptButton
Type : string
Default value : '确定'
Defined in src/app/component/dialog/confirm/confirm.component.ts:19
cancelButton
Type : string
Default value : '取消'
Defined in src/app/component/dialog/confirm/confirm.component.ts:18
message
Type : string
Defined in src/app/component/dialog/confirm/confirm.component.ts:17
title
Type : string
Defined in src/app/component/dialog/confirm/confirm.component.ts:16
 
import { Component } from '@angular/core';
import { MatDialogRef } from '@angular/material/dialog';

@Component({
  selector: 'stbui-dialog-confirm',
  templateUrl: './confirm.component.html',
  styleUrls: ['./confirm.component.scss']
})
export class ConfirmComponent {
  title: string;
  message: string;
  cancelButton: string = '取消';
  acceptButton: string = '确定';

  constructor(private dialogRef: MatDialogRef<ConfirmComponent>) {}

  cancel(): void {
    this.dialogRef.close(false);
  }

  accept(): void {
    this.dialogRef.close(true);
  }
}
Copy
<stbui-dialog>
  <stbui-dialog-title *ngIf="title">
    {{title}}
  </stbui-dialog-title>
  <stbui-dialog-content>
    {{message}}
  </stbui-dialog-content>
  <stbui-dialog-actions>
    <button mat-button #closeBtn (keydown.arrowright)="acceptBtn.focus()" (click)="cancel()">{{cancelButton}}</button>
    <button mat-button #acceptBtn (keydown.arrowleft)="closeBtn.focus()" (click)="accept()" color="accent">{{acceptButton}}</button>
  </stbui-dialog-actions>
</stbui-dialog>
Copy

./confirm.component.scss

Copy
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""