componentHandler.upgradeAllRegistered() on ngView about angular-material-design-lite HOT 19 CLOSED

I had to do it inside the compile instead of the link (because the element has to be in the Dom to be upgraded).

So it worked on the mdl-text-field I'm now working on the other elements and updating the documentation

from angular-material-design-lite.

Hi @Piou2fois

Thank you for contributing to angular-material-design-lite!

This indeed a great idea that's very common in dynamic website.

I'm very interested in having a solution that works for all scenarios.. the problem with the scenario is that it only works for your scenario.

I can help you create a fix for your specific scenario and then we can maybe work on a fix for most scenarios.

So can you please provide a working plnkr of your issue?

from angular-material-design-lite.

Yeah you can get there
http://plnkr.co/edit/cocnTVF1g2mqziy89nL0?p=preview
And remove on the groups.html template to see the problem, this is a simple way I found with icebox on IRC to get the function launched.
The other system can be found there (solution made by Jimlei) : http://plnkr.co/edit/q14LPr34tUELd3lDCywE?p=preview
It is using a directive with function as parameter (any function, idea is to use the component....

from angular-material-design-lite.

I'm sorry but I couldn't reproduce the issue.. I'm probably missing something.

Can you please provide me with 2 plnkrs, one of them containing the issue and the other one fixed?

Also please try to make it as brief as possible so I can focus on the issue we're trying to solve.

Thanks again!

from angular-material-design-lite.

http://plnkr.co/edit/MUI2iBslIH9jd4fgEQPL?p=preview
I made 2 templates, one is working with the ngIf the other one not (the style of the textfield is not "rippled" )

from angular-material-design-lite.

Don't forget I did not used your directive yet, but I imagine you will have the same issue

from angular-material-design-lite.

Thank you very much!

The solution would be to use the componentHandler.upgradeElement() method on the linking phase of the directive just like MDL suggests on their website: http://www.getmdl.io/started/index.html#dynamic

Working on a fix

from angular-material-design-lite.

That's in fact the problem, elements have to be in the DOM to be updated. Don't master yet the directive system so can't help you with that, but if you found the solution that's perfect, tou can now reach a full working MDL system.

from angular-material-design-lite.

Yeah I'm having some other issues now with the Checkbox and I'm seeing some of these issues are already open on MDL's repository.. So I might have to postpone it or go with a temporary solution just like you suggested (an attribute directive that fires only at the end).. but it feels like a hack

from angular-material-design-lite.

hacking is not a solution I think.

from angular-material-design-lite.

True.

Okay just noticed that they released 1.0.1. I should upgrade and see if it makes a difference.

from angular-material-design-lite.

Great at least now I can write upgradeElement(el) without specifying its type: MaterialButton, etc..
So I still have the issue with the ripples.. And the issue is still open google/material-design-lite#804
So I'm subscribed and I'll fix it as soon as it's possible

from angular-material-design-lite.

Actually I just noticed that the problem seems to be because the element was already upgraded..

from angular-material-design-lite.

Unfortunately, we have to wait for the open issue.
Thanks again for contributing and don't forget to star the project!

from angular-material-design-lite.

Hey @Piou2fois

I just pushed the mdl-upgrade attribute directive as a temporary solition. Check out the docs and let me know if it works for you!

It's a very lightweight solution since it only upgrades the MDL component itself (upgradeElements instead of upgradeAllRegistered) and you only add it on the required elements.

from angular-material-design-lite.

Great. I am going to update my project using your directives (switched to lumx as branch, will create a new branch with angularMDL)

from angular-material-design-lite.

Great! Let me know how it goes.. So the new directives are working as expected?

from angular-material-design-lite.

Did not try yet, this afternoon I will give a try and let you know

from angular-material-design-lite.

Closing this for now, feel free to re-open

from angular-material-design-lite.