如何为Angular应用内所有MatDialog统一设置disableClose=true属性？

方法一：通过模块全局配置（优先尝试） #

在app.module.ts中使用MAT_DIALOG_DEFAULT_OPTIONS提供器设置全局默认配置，确保所有MatDialog默认开启disableClose：

import { NgModule } from '@angular/core';
import { MAT_DIALOG_DEFAULT_OPTIONS } from '@angular/material/dialog';
// 其他导入...

@NgModule({
  declarations: [/* 组件声明 */],
  imports: [/* 模块导入 */],
  providers: [
    {
      provide: MAT_DIALOG_DEFAULT_OPTIONS,
      useValue: { disableClose: true }
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

如果该配置未生效，排查以下几点：

• 检查是否有懒加载模块或其他子模块也配置了MAT_DIALOG_DEFAULT_OPTIONS，子模块的配置会覆盖全局配置。
• 确认组件中打开Dialog时，没有手动传入disableClose: false（显式传入的配置会覆盖默认值）。

方法二：自定义封装Dialog服务（确保全局生效） #

如果模块配置无法覆盖所有场景，可封装一个全局Dialog服务，强制在打开弹窗时添加disableClose: true：

1. 创建custom-dialog.service.ts：

import { Injectable } from '@angular/core';
import { MatDialog, MatDialogConfig, MatDialogRef } from '@angular/material/dialog';

@Injectable({ providedIn: 'root' })
export class CustomDialogService {
  constructor(private dialog: MatDialog) { }

  open<T>(component: any, config?: MatDialogConfig): MatDialogRef<T> {
    // 合并默认配置与传入配置，传入的配置可覆盖默认值（如需允许例外场景）
    const mergedConfig = { disableClose: true, ...config };
    return this.dialog.open<T>(component, mergedConfig);
  }
}

2. 在所有需要打开弹窗的组件中，注入CustomDialogService替代原生MatDialog：

import { Component } from '@angular/core';
import { CustomDialogService } from './custom-dialog.service';
// 导入你的弹窗组件
import { YourDialogComponent } from './your-dialog/your-dialog.component';

@Component({
  selector: 'app-example',
  template: '<button (click)="openDialog()">打开弹窗</button>'
})
export class ExampleComponent {
  constructor(private dialogService: CustomDialogService) { }

  openDialog() {
    this.dialogService.open(YourDialogComponent);
  }
}

这种方式能确保所有通过该服务打开的弹窗都默认开启disableClose，同时支持在需要时传入disableClose: false来覆盖默认规则。

内容的提问来源于stack exchange，提问作者user22114465