[英]Dynamically modifying lazy loaded routes not working
I am trying to modify routes in a lazy-loaded feature module but no success.我正在尝试在延迟加载的功能模块中修改路由,但没有成功。 I tried several approaches including router.reset(newRoutes)
but none seem to work.我尝试了几种方法,包括router.reset(newRoutes)
但似乎都没有。 (Angular 9) (角度 9)
export class FeatureModule {
static forRoot(routes?: Routes) {
return {
ngModule: FeatureModule,
providers: [
RouterModule.forChild(routes).providers // option 1
// provideRoutes(routes), // option 2
// { provide: ROUTES, useValue: routes }, // option 3
]
}.ngModule
}
}
FeatureModule
is lazy loaded into the main app: FeatureModule
被延迟加载到主应用程序中:
loadChildren: () => import('./feature/feature.module').then((m) => m.FeatureModule.forRoot(customRoutes)
None of the options work.任何选项都不起作用。 Angular does not detect those dynamically provided routes Angular 不检测那些动态提供的路由
If I provide static default routes in the imports
then it works but then I am not able to modify the routes如果我在imports
中提供 static 默认路由,那么它可以工作,但是我无法修改路由
@NgModule({
imports: [RouterModule.forChild(defaultRoutes)]
})
export class FeatureModule { }
I wonder if this has something to do with Angular itself or I am doing something wrong我想知道这是否与 Angular 本身有关,或者我做错了什么
That will not work, because imports
and providers
are two different things and the RouterModule is a Module so it should be placed in the imports
section.那是行不通的,因为imports
和providers
是两个不同的东西,RouterModule 是一个模块,所以它应该放在imports
部分。
Using dynamic routes in a lazy-module it's a little tricky, i dont know if there is another way, but you could try the following:在惰性模块中使用动态路由有点棘手,我不知道是否有其他方法,但您可以尝试以下方法:
Use and export a variable in the FeatureModule
and fill the routes on the lazy-load.在FeatureModule
中使用和导出一个变量,并在延迟加载时填充路由。
export const FeatureModuleRoutes = [];
@NgModule({
imports: [RouterModule.forChild(FeatureModuleRoutes)]
})
export class FeatureModule { }
Lets create an InjectionToken and store the routes in there.让我们创建一个 InjectionToken 并将路由存储在其中。
//Create the injection token
const ROUTES_STORE = new InjectionToken("Loading lazy routes");
//In your AppModule provide the routes that you need.
{
provide: ROUTES_STORE,
useValue: [{featureRoutes: [{path: "", component: FeatureComponent}]}]
},
To inject the token you need an injector, the AppModule it is called before the lazy-load, so you could provide an static injector and use it later.要注入令牌,您需要一个注入器,即在延迟加载之前调用它的 AppModule,因此您可以提供一个 static 注入器并稍后使用它。
export class AppModule {
static mInjector: Injector;
//Inject the Injector so we can access it before de Lazy Module
constructor(injector: Injector) {
AppModule.mInjector = injector;
}
}
Now you have an injector and the routes, it is time to fill your FeatureModuleRoutes.现在你有了一个注入器和路由,是时候填充你的 FeatureModuleRoutes 了。 The m
it is the file so you can access to your variable before is loaded. m
它是文件,因此您可以在加载之前访问您的变量。
loadChildren: () =>
import("./feature/feature.module").then(m => {
const routeStore = AppModule.mInjector.get(ROUTES_STORE);
routeStore.featureRoutes
.forEach(route => (m.FeatureModuleRoutes as Array<any>).push(route));
return m.FeatureModule;
})
And that is it, let me know if it helps.就是这样,让我知道它是否有帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.