Question

我正在查看Modals的Primeng文档，但我找不到以编程方式关闭模态框的方法（例如，当我点击＆＃34;接受＆＃34;按钮时）。

来源：https://www.primefaces.org/primeng/#/dialog

Answer 1

如文档所示，<p-dialog>组件具有[(visible)]属性。它是双重绑定的，因此您可以通过将上述属性的值设置为 false 来实际关闭（或隐藏）元素。例如：

<p-dialog header="Foo" [(visible)]="showDialog">
  <p-footer>
    <button type="button" (click)="functionToCloseDialog()" label="Accept"></button>
  </p-footer>
</p-dialog>

你的ts文件会有类似的内容：

export class SomeComponent {
  showDialog: boolean;

  functionToCloseDialog() {
    this.showDialog = false; // closes/hides the dialog box
  }
}

Answer 2

现在你不需要使用隐藏和显示。您需要包含 DynamicDialogRef 服务，例如：

 constructor(private ref: DynamicDialogRef) {}

 closeModal(): void {
    this.ref.close();
 }

 closeModalWithData(): void {
   // you can pass data like this
   this.ref.close(data)
   // and catch it after with onClose event
 }

单击时关闭Primeng的ModalBox

2 个答案: