对话框模式立即关闭，白色角度材质

Question

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

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

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

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>

Answer 2

基本上，您打开模态，href 会导致导航到"主页"并基本上进行页面刷新。

从链接中删除 href="：

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

这是更新的链接。