系统对话角材料

Question

我为对话系统(角质材料)工作。

我创建对话框-服务为控制和容器对话框。对话框-服务有打开/显示不同对话框的方法。

我创建了对话框组件，用于包含对话框的数据(它是对话框的单个组件)。它是普遍的组成部分。

我添加了StackBlitz

我在回电话后关闭对话框有问题。回调后如何关闭对话框？我尝试使用mat-dialog-close --但我无法以某种方式参数化--启用和禁用不同按钮的mat-dialog-close。

还有个小问题。我如何能够添加动态的垫按钮到按钮元素？

(我添加了类“垫按钮”，但这不是完全模仿垫按钮)

 <div *ngIf="getButtons().length > 0 || getCloseButton()" mat-dialog-actions>
    <ng-container *ngFor="let button of getButtons()">
      <button [attr.class]="button.class"
        (click)="button.callback(button.callbackItem || dialogForm)">{{button.title}}</button>
    </ng-container>
</div>

Answer 1

在您的dialog.html中必须有这样的内容：

<button mat-stroked-button (click)="closeDialog()">Close</button>

在你的dialog.ts中：

import { Component, OnInit, Inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';

@Component({
  selector: 'dialog',
  templateUrl: './dialog.component.html',
  styleUrls: ['./dialog.component.scss']
})
export class DialogComponent implements OnInit {

  constructor(public dialogRef: MatDialogRef<DialogComponent>) { }

  ngOnInit() {
  }

  closeDialog() {
    this.dialogRef.close();
  }

}