Основание 6 Вложенное проявление не уважает multipleOpened

Question

Я использую Foundation 6 с Angular2, и у меня есть пара модальных выражений, которые нужно открыть в последовательности. Я скопировал пример из Zurb напрямую, но когда я нажимаю кнопку в первом модальном, новый модальный открывается, а первый не закрывается.

Значение по умолчанию для multipleOpened должно быть ложным, но они просто открываются друг на друга.

Screenshot

Я попытался установить data-multiple-opened="false", а также data-options="multipleOpened:false;", но они по-прежнему открыты друг на друга.

Вот мой код:

<p><a data-open="exampleModal2">Click me for a modal</a></p> 

<!-- This is the first modal --> 
<div class="reveal" id="exampleModal2" data-reveal data-options="multipleOpened:false;"> 
    <h1>Awesome!</h1> 
    <p class="lead">I have another modal inside of me!</p> 
    <a class="button" data-open="exampleModal3">Click me for another modal!</a> 
    <button class="close-button" data-close aria-label="Close reveal" type="button"> 
    <span aria-hidden="true">&times;</span> 
    </button> 
</div> 

<!-- This is the nested modal --> 
<div class="reveal" id="exampleModal3" data-reveal data-options="multipleOpened:false;"> 
    <h2>ANOTHER MODAL!!!</h2> 
    <button class="close-button" data-close aria-label="Close reveal" type="button"> 
    <span aria-hidden="true">&times;</span> 
    </button> 
</div> 

Может кто-нибудь мне точку в правильном направлении?

Answer 1

Я не уверен, если это эффект вы после этого, но вы можете принудительно закрытие первого модального путем добавления data-close на кнопку, которая запускает второй один:

<a class="button" data-close data-open="exampleModal3">Click me for another modal!</a> 

JSFiddle example