[英]Library Routing in Angular 14 with Standalone Components
I'm using Angular 14 and their new Standalone Components feature in the context of a library .我在库的上下文中使用 Angular 14 及其新的独立组件功能。 How can I use RouterModule.forChild() in the component as Angular won't let me do it?
我如何在组件中使用 RouterModule.forChild() 作为 Angular 不会让我这样做?
...
projects/
my-lib/
src/lib
root.component.ts
my-app/
...
import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { RouterModule } from '@angular/router';
@Component({
standalone: true,
imports: [CommonModule, RouterModule.forChild([])],
selector: 'my-lib-root',
template: ` <router-outlet></router-outlet>`,
})
export class RootComponent {}
Got the error得到错误
'imports' contains a ModuleWithProviders value, likely the result of a 'Module.forRoot()'-style call. These calls are not used to configure components and are not valid in standalone component imports - consider importing them in the application bootstrap instead.
But as I'm using a library, I don't have any "application bootstrap" in this context.但是当我使用一个库时,我在这个上下文中没有任何“应用程序引导程序”。
Just drop the.forChild([]).只需删除 .forChild([])。 You don't want a "ModuleWithProviders" at your component level.
您不希望在组件级别出现“ModuleWithProviders”。
If I'm not mistaken, since version 14.2如果我没记错的话,从 14.2 版开始
You can use routing like this:您可以像这样使用路由:
export const TEST_ROUTES: Routes = [
{
path: '',
redirectTo: 'test1',
pathMatch: 'full',
},
{
path: '',
component: TestComponent,
children: [
{
path: 'test1',
loadComponent: () =>
import('../test1/test1.component').then((m) => m.Test1Component),
},
],
},
];
then然后
export const APP_ROUTES: Routes = [
{
path: '',
pathMatch: 'full',
redirectTo: 'test',
},
{
path: 'test',
loadChildren: () =>
import('./app/test/test.routes').then((m) => m.TEST_ROUTES),
},
];
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.