Динамическое добавление выдвижного ящика MDL

Question

У меня возникла проблема с динамическим добавлением навигационного ящика Material Design Lite (MSL). Я посмотрел на подобный вопрос, а именно:

Rerendering MDL drawer menu makes drawer button disappear

и связанное с ним

http://mdlhut.com/2015/07/where-is-the-mdl-drawer-icon/

, и я считаю, я правильно модернизации DOM, добавив его. Я соединил то, что я думаю, что это самые простые из возможных примеров по адресу:

https://acuth.github.io/b2wac/html/mdl2.html

Если я раскомментировать леи-layout__drawer все работает правильно, хотя значок нав ящик не правильно выровнен, который заставляет меня задаться вопросом, если проблема в том, что я пропустил какой-то жизненно важный элемент в исходном HTML.

Как всегда любая помощь была бы с благодарностью получена.

Answer 1

вы должны добавить событий JavaScript:

<script type="text/javascript"> 
    document.addEventListener('turbolinks:load', function() { 
     componentHandler.upgradeDom(); 
    }); 
</script> 

Приветствия.

Также вы можете добавить новую функцию javascript, которая добавит innerHTML в ваш навигационный ящик. Затем обновите DOM.

Answer 2

Попробуйте понизить узлы, а затем обновить DOM.

componentHandler.downgradeElements(document.querySelector(".mdl-layout")); 
componentHandler.upgradeDom();