動態添加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

如果我取消了MDL-layout__drawer這一切工作正常，雖然導航抽屜圖標沒有正確對齊這讓我懷疑問題是我錯過了原始HTML中的一些重要元素。

一如既往的任何幫助將受到感謝。

Answer 1

你應該添加一個JavaScript事件：

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

乾杯。

此外，您還可以添加新的JavaScript功能，在導航抽屜上添加innerHTML。然後升級。

Answer 2

嘗試降級節點，然後升級DOM。

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