Angular Material 没有对话框组件的 viewchild 对话框 class

Question

有什么方法可以在不创建对话框组件的情况下打开带有视图子引用的 angular material 2 对话框？

Answer 1

试试这个

View.html

 <button (click)="openModal(mytemplate)">Open my template</button>

 <ng-template #mytemplate>
      <h1>It works</h1>
 </ng-template>

component.ts

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

 export class Component implements OnInit {
      constructor(
           public dialog: MatDialog
      ) { }

      openModal(templateRef) {
           let dialogRef = this.dialog.open(templateRef, {
                width: '250px',
                // data: { name: this.name, animal: this.animal }
           });
    
           dialogRef.afterClosed().subscribe(result => {
               console.log('The dialog was closed');
               // this.animal = result;
           });
     }
}