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>

Answer 2

基本上，你打开模态，href导致导航到“home”并基本上进行页面刷新。

从链接中删除href =“”：

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

以下是更新后的link。

对话模式立即关闭Angular Material

2 个答案: