ngx-bootstrap 模态中的 ngx-bootstrap 模态

Question

我正在开发一个 Angular 应用程序。我有一个 ngx-bootstrap 模式，它又是从“父”引导模式启动的。也就是说，它是嵌套在另一个模态中的模态。

关闭模态框的代码行是：this.bsModalRef.hide()。

问题是，当我单击触发执行该代码行的函数的按钮时，它可以完美运行，但是，最大的问题是当我执行同一行代码以关闭 child modal 这个关闭了，但是 parent modal 失去了 close 的能力，即使点击了执行这行代码的 Close 按钮关闭模式。

这是关闭第一个（“父”）BsModalRef modal 的按钮：

 <button class="btn btn-oval btn-sm ml-2"
        (click)=" closeModal()"
        type="button">
        Close
      </button>

这是 .ts 文件中使“关闭”按钮关闭第一个模式的函数：

  closeModal() {
    this.bsModalRef.hide();
  }

现在，第二个模态也必须有一个选项来关闭它并返回到前一个模态，就像第一个模态也有一个关闭按钮，它也执行这个返回主屏幕：

closeModal() {
    this.bsModalRef.hide();
  }

它实际上关闭了第二个模态，但是当试图关闭第一个模态以返回主屏幕时，这个 关闭 按钮停止工作并且无法关闭它。

为什么会这样？有什么建议吗？

谢谢。

Answer 1

问题是您在子组件和父组件 BsModalRef 命名中都使用“bsModalRef”名称，请将其中一个更改为不同的名称。