Angular Material Dialog Dialog()不起作用

Question

关闭不工作，dialgref .close()是未定义的??

下面是代码模板

<button  mat-raised-button (click)="openModal()">Open Project Specifics</button>

TS

openModal(){
let dialogRef = this.dialog.open(ProjectSpecificContentComponent, {
data:{projectsSpecifics: this.projectSpecific},
panelClass: 'project-content-dialog'
})
dialogRef.afterClosed().subscribe(result => console.log(result))
}

这里是所谓的Component

<button mat-dialog-close>X</button>
<div class="container">
<div class="project-specific" *ngFor="let projectS of projectSpecificList">
<h5>{{projectS.name}}</h5>
<mat-form-field appearance="fill" class="mat-group">
<mat-label>Add project specific</mat-label>
<mat-select multiple>
<mat-option *ngFor="let item of getContent(projectS)">{{item.content}}</mat- 
option>
</mat-select>
</mat-form-field>
</div>
</div>
<div mat-dialog-actions>
<button (click)="onClose()" mat-raised-button>Done!</button>
</div>

和TS

constructor(@Inject(MAT_DIALOG_DATA) public data: any,
public dialogRef: MatDialogRef<ProjectSpecificContentComponent>,
) { }

onClose(){
this.dialogRef.close();
}

你还可以在这里看到我导入组件的模块

imports[MatDialogModule]
entryComponents: [ProjectSpecificContentComponent]

Answer 1

我的对话码(TS)是这样的:

export class DialogFormComponent implements OnInit {
/**
* @param {MatDialogRef<DialogFormComponent>} matDialogRef
*/
constructor(
public matDialogRef: MatDialogRef<DialogFormComponent>, 
)
onClose(){
this.MatDialogRef.close();
}

}

你可以用同样的方法试试

Answer 2

第一步:

public dialogRef: MatDialogRef<any>, 

在构造函数中添加

步骤2:定义完材料dialog之后，将你的局部变量dialgref赋值给全局变量this。dialogRef变量

。

步骤3:现在执行this.dialog .close()

希望这对你有用。