-
Notifications
You must be signed in to change notification settings - Fork 6.7k
-
Notifications
You must be signed in to change notification settings - Fork 6.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Make Material modules compatible with lazy-loaded components #1071
Comments
A user with the handle 'James' on StackOverflow helped me find an acceptable workaround until lazy routes are supported. Basically, instead of importing
Import |
Should be fixed with #1108 |
@jelbourn There is a typo in the Readme at 91a7e5e#diff-e342377e67af0990cf438fc364e6308dR14 You're importing |
forRoot() should only be used when importing into a root module. Using forRoot() here will cause Material services that only work as singletons (eg: MdIconRegistry) to fail. See angular/components#1071
This must be done at the root module so Material services can work as singletons even with lazy-loaded components. See angular/components#1071
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Bug, feature request, or proposal:
Proposal
What is the expected behavior?
Services that are only practically useful as singletons should be available as such.
MdIconRegistry
is a perfect example. SinceMdIconRegistry.addSvgIconSet()
adds icons that should be available app-wide, this service is most useful as a singleton. Instead of simply offeringMdIconModule
as an export, offerMdIconModule.forRoot
as an alternative that can be used to add providers only to the root module in accordance with the Angular docs. So my proposal is to remove services that are meant to be used as a singleton by client modules from theproviders
arrays of material modules. Changeto
So that in the root
AppModule
we can importMdIconModule.forRoot()
, thus registering its provider just once to all components including lazy-loaded ones.What is the current behavior?
Because even services that should be singletons are included in the
providers
array of their respective Material modules, I don't know how it's possible to make them singletons. To pick up the example above, when I executeMdIconRegistry.addSvgIconSet()
in myAppComponent
, the icons are not visible to lazy-loaded modules because they have a different Angular services injector.What are the steps to reproduce?
Open this plunker and navigate to the
LazyLoadedComponent
view. You'll notice that the icon doesn't show up and the console logs the error below:What is the use-case or motivation for changing an existing behavior?
The current setup makes services that are only practical as singletons really difficult to use. The only workarounds I've found are:
Which versions of Angular, Material, OS, browsers are affected?
Angular 2 rc.5
withMaterial 2 alpha 7-3
Is there anything else we should know?
I've been studying this issue for a while now and this post is the culmination of my observations in #1022 and #1016 . The Angular docs recommend a strategy akin to what I propose here:
The text was updated successfully, but these errors were encountered: