类型“MatDialogModule”上不存在属性“打开”答案

【问题标题】：Property 'open' does not exist on type 'MatDialogModule'类型“MatDialogModule”上不存在属性“打开”
【发布时间】：2023-03-12 03:26:01
【问题描述】：

刚刚开始构建 Angular 应用程序。我正在编写一个小型图书库存应用程序。我在使用 Material Module 中的 Dialog 组件 时遇到问题。我访问了 Angular 材料网站以检查我的实现，但仍然无法让它按预期运行。我在 snackbar 组件 上遇到了类似的问题。想知道是否有人以前遇到过这个问题。感谢您的帮助！

app.Module.ts

import {MatDialogModule } from '@angular/material/dialog';

imports:[MatDialogModule]

collection.component.ts

import {MatDialogModule, MatDialogRef } from '@angular/material/dialog';

bookDetailDialogRef: MatDialogRef<BookDetailComponent>;

constructor(private dataService: DataService, private snackBar: MatSnackBarModule,
              private _dialog: MatDialogModule, private _router: Router){}

openDialog(bookId: number): void{
    let config = {with: '650px', height: '400px', position: {top: '50px'}};
    let dialogRef = this._dialog.open(this.bookDetailDialogRef, config);
    dialogRef.componentInstance.bookId = bookId;
    dialogRef.afterClosed().subscribe(res => {this.getBooks();});
  }

collection.component.html

<button mat-button (click)="openDialog(book.id)"><i class="material-icons">
              pageview</i> Dialog</button>

【问题讨论】：

标签： javascript html css angular angular-material

【解决方案1】：

将MatDialogModule 替换为MatDialog

constructor(

public dialog: MatDialog

)

【讨论】：

欢迎来到 Stack Overflow！虽然这段代码可以解决问题，including an explanation 解决问题的方式和原因确实有助于提高帖子的质量，并可能导致更多的赞成票。请记住，您正在为将来的读者回答问题，而不仅仅是现在提出问题的人。请edit您的答案添加解释并说明适用的限制和假设。

【解决方案2】：

_dialog 的类型为 MatDialog 而不是 MatDialogModule 并将 MatSnackBarModule 更改为 MatSnackBar。在您的构造函数中将其更改为，

constructor(private dataService: DataService, private snackBar: MatSnackBarModule,
              private _dialog: MatDialog, private _router: Router){}

【讨论】：

还将MatSnackBarModule 更改为MatSnackBar。
@Sajeetharan 效果很好！谢谢！这是一个很大的帮助！