代码之家  ›  专栏  ›  技术社区  ›  coder

关闭子弹出窗口时如何关闭父弹出窗口?

  •  1
  • coder  · 技术社区  · 2 年前

    我正在Angular中开发一个web应用程序,需要处理嵌套的弹出窗口。具体来说,我有一种情况,我打开一个弹出窗口(弹出窗口1),然后在该弹出窗口中,单击删除时打开另一个弹出菜单(弹出窗口2)。我想要实现的是,当我在弹出菜单2上单击“是”时,弹出菜单1和弹出菜单2都应该关闭。

    以下是我的代码的完整演示:

    Demo@StackBlitz

    1 回复  |  直到 2 年前
        1
  •  1
  •   Naren Murali    2 年前

    谢谢你的堆叠。我们有一个名为的方法 closeAll ,我们可以使用它来关闭这两个弹出窗口。

    import { Injectable } from '@angular/core';
    import { MatDialog } from '@angular/material/dialog';
    import { CofirmDialogComponent } from '../cofirm-dialog/cofirm-dialog.component';
    import { filter } from 'rxjs';
    
    @Injectable({
      providedIn: 'root',
    })
    export class DialogService {
      constructor(private dialog: MatDialog) {}
      public deleteTaskDialog(id: number) {
        this.dialog
          .open(CofirmDialogComponent, {})
          .afterClosed()
          .pipe(filter((id) => id))
          .subscribe((confirm) => {
            this.dialog.closeAll(); // <- changed here!
          });
      }
    }
    

    Stackblitz Demo