如何将组件作用域服务传递给该组件弹出的模态对话框？

方法1：手动传递服务实例 #

在打开对话框时，直接把组件内的服务实例作为数据传过去，对话框里直接取用即可：

// 父组件代码
constructor(private componentScopedService: ComponentScopedService, private dialog: MatDialog) {}

openDialog() {
  this.dialog.open(MyDialogComponent, {
    data: {
      sharedService: this.componentScopedService
    }
  });
}

// 对话框组件代码
constructor(@Inject(MAT_DIALOG_DATA) public data: { sharedService: ComponentScopedService }) {
  // 直接通过data.sharedService访问服务的方法或属性
  console.log(data.sharedService.someProperty);
}

方法2：传入父组件的注入器 #

打开对话框时，把父组件的Injector传进去，让对话框继承父组件的注入上下文，这样就能直接在构造函数里注入目标服务：

// 父组件代码
constructor(private injector: Injector, private dialog: MatDialog) {}

openDialog() {
  this.dialog.open(MyDialogComponent, {
    injector: this.injector
  });
}

// 对话框组件代码
constructor(private componentScopedService: ComponentScopedService) {
  // 这里可以直接使用注入的服务
}

这种方式更贴合依赖注入的设计逻辑，适合需要在对话框多个地方注入该服务的场景。

关键注意点 #

• 确保目标服务是在父组件的providers数组中声明的（而非模块级别），这样服务实例才是父组件独有的作用域实例。
• 如果用的是其他UI库的对话框组件，传递注入器的API可能略有差异，但核心思路一致——让对话框复用父组件的注入环境。

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