时间戳

首页 > 解决方案 > 如何从应用程序中的任何位置打开模式

angular - 如何从应用程序中的任何位置打开模式

问题描述

我需要将所有模式放在一个地方，以便我可以从应用程序中的任何位置访问任何模式。这可能吗。

现在，我正在以下面的方式打开一个模式。

openModal(template: TemplateRef<any>,cssClass:any) {
    if(this.modalRef) {
        this.closeModal();
    }
    this.config.class = cssClass;
    this.modalRef = this.modalService.show(template, this.config);
}
closeModal() {
    if(this.modalRef) {
        this.modalRef.hide();
        this.modalRef = null;
    }
}

在我的 HTML 中

<button (click)="openModal(someModal,'some-class')">Click</button>

<ng-template #someModal> <div class="modal-body"> Login Here </div></ng-template>

我尝试过以下方式 https://stackblitz.com/edit/angular-wuntd3

我本地的 HTML 元素 在此处输入图像描述

标签： angulartypescriptngx-bootstrap

解决方案

您可以创建一个自定义指令，您可以在其中从应用程序的任何位置访问模式。只有模态的内容会根据需求的上下文而有所不同。

推荐阅读