为什么Modal打开一个新的打开弹窗？

Question

当我尝试使用 ng-bootstrap

打开模式时注意到一个我无法理解的奇怪行为

 openModal(content,modalActionType) {
        this.modalActionType = modalActionType;
        console.log(this.modalActionType);
        open(content);
        return false;
  }
  open(content) {
        this.modalService.open(content, {ariaLabelledBy: 'modal-basic-title'})
        .result.then((saveOrCancel) => {
        }, (dismissReason) => {});
   }

HTML

<a class="dropdown-item" (click)="openModal(content,'Reset')">Reset Password</a>

当我单击“重置密码”时，尽管我从 openModal 函数返回 false，但会打开一个新选项卡。

奇怪的是，下面的代码可以正常工作，模式按预期打开。为什么会这样？

openModal(content,modalActionType) {
    this.modalActionType = modalActionType;
    console.log(this.modalActionType);
    this.modalService.open(content, {ariaLabelledBy: 'modal-basic-title'})
    .result.then((saveOrCancel) => {
    }, (dismissReason) => {});
    return false;
  }

Answer 1

问题出在您的 openModal 方法中：

openModal(content,modalActionType) {
    this.modalActionType = modalActionType;
    console.log(this.modalActionType);
    open(content);
    return false;
}

方法 open(content); 的第三行应更改为 this.open(content); 以确保它调用您在组件 TypeScript 文件中定义的 open 方法而不是 window.open() - 这将打开一个新的 window 或选项卡（取决于浏览器）。

请参阅 this StackBlitz 进行演示。如果您将 modal-basic.ts 中的第 18 行从 this.open(content); 更改为 open(content);，它将打开一个新的浏览器选项卡，而不是打开模式。

为什么Modal打开一个新的打开弹窗？

Why does Modal open a new open pop up?

bootstrap-4

ng-bootstrap

angular