动态修改延迟加载的路由不起作用

Question

我试图在一个延迟加载的功能模块中修改路由，但没有成功。我尝试了几种方法，包括router.reset(newRoutes)，但似乎都不起作用。(角度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延迟加载到主应用程序中：

loadChildren: () => import('./feature/feature.module').then((m) => m.FeatureModule.forRoot(customRoutes)

所有选项都无效。Angular无法检测到那些动态提供的路线

如果我在imports中提供静态默认路由，那么它可以工作，但我无法修改路由

@NgModule({
imports: [RouterModule.forChild(defaultRoutes)]
})
export class FeatureModule { }

我想知道这是否与Angular本身有关，或者我做错了

Answer 1

这是行不通的，因为imports和providers是两个不同的东西，RouterModule是一个模块，所以它应该放在imports部分。

在懒惰模块中使用动态路由有点棘手，我不知道是否有其他方法，但你可以尝试以下方法：

使用并导出FeatureModule中的变量，并填充延迟加载上的路由。

export const FeatureModuleRoutes = [];
@NgModule({
imports: [RouterModule.forChild(FeatureModuleRoutes)]
})
export class FeatureModule { }

让我们创建一个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}]}]
},

要注入令牌，您需要一个注入器，在延迟加载之前调用它的AppModule，因此您可以提供一个静态注入器并在以后使用它。

export class AppModule {
static mInjector: Injector;
//Inject the Injector so we can access it before de Lazy Module
constructor(injector: Injector) {
AppModule.mInjector = injector;
}
}

现在您有了注入器和路由，是时候填充FeatureModuleRoutes了。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;
})

就是这样，如果有帮助，请告诉我。