бумажно-диалог в Polymer не закрывается в iPhone

Question

Я использую этот пример из дока полимера

<paper-dialog> 
    <h2>Header</h2> 
    <paper-dialog-scrollable> 
     Lorem ipsum... 
    </paper-dialog-scrollable> 
    <div class="buttons"> 
    <paper-button dialog-dismiss>Cancel</paper-button> 
    <paper-button dialog-confirm>Accept</paper-button> 
    </div> 
</paper-dialog> 

В каждом браузере диалог закрывается, когда я нажимаю на месте, которое не диалог, но на iPhone IOS 8.4 не работает. Я не могу закрыть диалог.

Как я могу решить эту проблему?

Answer 1

Я знаю, что проблема с Z-индексом связана с Safari на IOS. Вероятно, бумажный диалог не наверху, как должно быть. Вам может понадобиться префикс -webkit для класса, когда он использует IOS.

Answer 2

После некоторых исследований я обнаружил, что вопрос о полимере Github, и есть способ взломать его, чтобы он работает:

_finishRenderOpened: function() { 
    // focus the child node with [autofocus] 
    if (!this.noAutoFocus) { 
    this._focusNode.focus(); 
    } 

    if(this.withBackdrop) { 
    this.parentNode.insertBefore(this._backdrop, this); 
    } 

    this.fire('iron-overlay-opened'); 

    this._squelchNextResize = true; 
    this.async(this.notifyResize); 
}, 

(код по https://github.com/dhpollack)

«Для реализации хак dhpollack в в хороший способ добавить эту функцию в пользовательский элемент:

patchOverlay: function (e) { 
    if (e.target.withBackdrop) { 
     e.target.parentNode.insertBefore(e.target._backdrop, e.target); 
    } 
}, 

И добавить on-iron-overlay-opened="patchOverlay" на все ваши <paper-dialog> «s»

(реализация по https://github.com/rubenstolk)

Github вопрос: https://github.com/PolymerElements/paper-dialog/issues/7

Надеется, что это работает для вас :)