在流星js中的同一页上打开多个实现模型

Question

id of 1st modal is "modal1" and 2nd modal id is "modal2"

HTML代码->

同一页面上的第一个模态调用

<div class="input-field col s12 m6 left-align">
                <button class="btn waves-effect waves-light modal-trigger importButton" style="height:45px !important">Import Data
                    <i class="material-icons right">import_export</i>
                </button>
</div>

同一页面上的第二模式调用

<div class="modal-trigger" style="cursor: pointer;">
                <img src="abc.png" alt="" class="circle">
</div>

JS代码->

'click .modal-trigger': function(event) {
    event.preventDefault();
    $('#modal1').openModal();
},
'click .importButton':function(event) {
     event.preventDefault();
    $('#modal2').openModal();
}

Answer 1

您必须引用定义了modal2的另一个模板{{> import}}（我的模板名称为import）。

Answer 2

您的问题不是很清楚。 据我了解，可以从同一模板中打开2个模态。 这里要注意的是，引导程序不支持彼此叠加的多个模式 。

不支持多个打开模式，请确保在仍然可见另一个模式时不要打开一个模式。 一次显示多个模态需要自定义代码。

因此，在打开第一个模态之前，必须首先始终检查另一个模态是否处于关闭状态，类似地，在打开第二个模态之前，必须检查第一个模态是否处于关闭状态，如果没有关闭则将其关闭。

流星中有一个软件包似乎可以帮助处理多种模态。 您可以查看peppelg：bootstrap-3-modal以在流星中更好地实现bootstrap模态。 特别是他们提到以下用途的部分：

Modal.allowMultiple = true