Repository navigation
URL Matcher to allow service injection, to allow two routes with same path to be selected based on criteria. #34231
Description
🚀 feature request
Relevant Package
This feature request is for @angular/routerDescription
Currently we have 2 levels of authorisation in our app: Super admin and Organisation Admin.
When those users login via /auth/login the are authenticated and then the logic redirects to the root /.
On the route path (''), I have 2 child routes, both using an UrlMatcher instead of a path.
{
path: '',
children: [
{
matcher: SuperAdminMatcher
loadChildren: <super admin module>
},
{
matcher: OrgAdminMatcher
loadChildren: <Org admin module>
}
]
Those matcher functions require to know what user was logged in via the AuthService. However, other then looking in my LocalStorage and get my JWT, there is no way for me to access the AuthService because I can't inject that service in the Matchers.
So my matcher can never reject based on AuthState.
I ideally want to offer to paths:
Superadmin:
/organisation/list
/organisation/ORG NAME/post/list <- super admin opening an Organisation
Org admin:
/post/list
/post/edit/<guid>
So unfortunately I have to use to different path names to make this work, and that makes the path unnecessary long, like `http://localhost:4200/superadmin/organisation/Bramble-Cay-College/post/list
Describe the solution you'd like
If you have a solution in mind, please describe it.Allow for Injection of Providers in the Matcher. This way we can create a more advanced matcher. It is kinda like Resolve, however Resolve is currently happening after the Path or Url has been matched.
Describe alternatives you've considered
Have you considered any alternative solutions or workarounds?The only real workaround I can find is using different path names, or using a wrapper component.
However, I want each child to lazy load a Module, and I create a RootComponent, and load either the SuperAdminComponent or the OrgAdminComponent via *ngIf, it wouldn't be lazy loaded.
Activity
krokofant commentedon Jan 27, 2020
Very valuable if you want to change the routed component based on feature toggles.
klemenoslaj commentedon Jun 2, 2020
The only way we can do that right now is to expose app injector when bootstrapping. This however is a bad idea I think. Would be nice if that would be natively possible.
angular-robot commentedon Jun 4, 2021
Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.
Find more details about Angular's feature request process in our documentation.
TreasureJim commentedon Sep 6, 2021
@klemenoslaj was this feature ever added? I'm looking for similar functionality with dynamic loading of module child routes depending on a service.
mattiLeBlanc commentedon Sep 6, 2021
@klemenoslaj The only way to do it now is to dynamically load one or more components that allow for your alternative Auth levels. However, you would not enjoy lazy loading for this solution.
TreasureJim commentedon Sep 6, 2021
@mattiLeBlanc Unfortunately that seems to be the only way for me currently. Since I am using this system for role based authentication the alternative I am thinking of using is
Router.ResetConfig()on login.Similar problem
feat(router): Add CanMatch guard to control whether a Route should match
angular-automatic-lock-bot commentedon Jul 14, 2022
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.