对话框模式立即关闭 Angular Material

Question

有人能告诉我为什么当我单击Crear Proyecto按钮时，模态打开然后立即关闭吗？

https://stackblitz.com/edit/angular-gsgmu8?embed=1&file=app/portafolio/portafolio.component.ts

我在模态中插入组件的内容。我正在使用 Angular 材料。

portafolio.component.ts

import { CrearProyectoComponent } from '../crear-proyecto/crear-proyecto.component';
import { MatDialog } from '@angular/material';


constructor(public dialog: MatDialog) { }

openAddModal() {
 let dialogRef = this.dialog.open(CrearProyectoComponent, {
        width: '600px'
    });
}

Answer 1

您正在使用a标签，这意味着，当您单击“按钮”时，它会尝试使用 href 导航到，因此您的应用会重新初始化。您可以将标签更改为适当的（垫子）按钮：

<button class="btn btn-primary" (click)="openAddModal()">
  Crear Proyecto <i class="fas fa-plus ml-2"></i>
</button>