Material-design-lite: Unregister components

[xSirrioNx]

Hi! I'm using MDL with Backbone.
Can anybody help me to unregister all components that associated with bacbone view before removing this view?

P.S. i use componentsHandler.upgradeDom(); after rendering view. Is that right?

[chrisarno76]

Yes I do believe you can back-up all and download to a secure location, to keep all your information safe, after you complete this action then uninstall what is needed, keep file on flash drive, or sd card when needed reinstall

[xSirrioNx]

@chrisarno76 , you mistake in topic?

[leifoolsen]

I think the downgrade event is disabled, see: https://github.com/google/material-design-lite/blob/master/src/mdlComponentHandler.js#L352

The custom event mdl-componentdowngraded is not triggered. Maybe you can call componentHandler.downgradeElements method to unregister? BTW none of the MDL components have an attached unregister method, as far as I can see - so there should be no need to unregister (?).

[xSirrioNx]

@leifoolsen
To call componentHandler.downgradeElements i need the list of components to downgrade and i don't know how to get them.

For example i have Backbone view, that render some table with checkboxes. After rendering this view i use componentsHandler.upgradeDom(); to register all checheckboxes in table.
All registered components will be pused to array "createdComponents_".
Then i remove this Backbone view and render it again. But after rerender in createdComponents_ array will be added all checkbox components again and old components (that was removed from DOM) stay in this array. So createdComponents_ become bigger and bigger. And i think that listeners for removed checkboxes (in my example) not removed too.

[leifoolsen]

Try something like this:

var elements = document.querySelctorAll('#my-container ["data-upgraded"]'); 
componentHandler.downgradeElements(elements);

Note: I have not tested the CSS query - so it may not be syntactically correct.

[xSirrioNx]

@leifoolsen
But you shold pass MDL component object to componentHandler.downgradeElements(), but not DOM element

[leifoolsen]

Downgrade either a given node, an array of nodes, or a NodeList.

 /**
   * @param {!Node|!Array<!Node>|!NodeList} nodes The list of nodes.
   */
  function downgradeNodesInternal(nodes) {
....

[xSirrioNx]

@leifoolsen
Jh, sorry, i make some changes in material.js and forget about it =)
Now all works good, thank you!

[Garbee]

Please use StackOverflow for support and integration assistance. This tracker is only for problems with the code provided by Material Design Lite.

Thank you.