角路由:以路径为字符串数组的多个出口

Question

在我的angular9应用程序中，路由路径是配置的，所以是否有任何方法可以使用多个端口和单个字符串路径数组。

当前代码：

const routes: Routes = [
    {
        path: 'Data/:EntityID/:Date',
        component: MyFormComponent,children:[
            {
                path: '',
                loadChildren: () => import('../data-entry/data-entry.module').then(m => m.DataEntryModule)
            }
        ], 
    } ,
    { 
        path: 'Settings/:EntityID/:Date',
        component: MyFormComponent,children:[
            {
                path: '',
                loadChildren: () => import('../data-entry/data-entry.module').then(m => m.DataEntryModule)
            }
        ]
    }
...
];
    
export const routing = RouterModule.forChild(routes);

那么是否有任何方法可以使用与字符串数组相同的路径。因为在上述情况下，脚本对于多个路径的相同组件将增加。

，有点像

const routes: Routes = [
    {
        path: ['Data/:EntityID/:Date','Settings/:EntityID/:Date',...],
        component: MyFormComponent,children:[
            {
                path: '',
                    loadChildren: () => import('../data-entry/data-entry.module').then(m => m.DataEntryModule)
            }
        ], 
    }
];
    
export const routing = RouterModule.forChild(routes);

请给我建议可能的方法。

谢谢。

Answer 1

查看一下路由接口：

interface Route {
  path?: string
  pathMatch?: string
  matcher?: UrlMatcher
  component?: Type<any>
  redirectTo?: string
  outlet?: string
  canActivate?: any[]
  canActivateChild?: any[]
  canDeactivate?: any[]
  canLoad?: any[]
  data?: Data
  resolve?: ResolveData
  children?: Routes
  loadChildren?: LoadChildren
  runGuardsAndResolvers?: RunGuardsAndResolvers
}

路径声明为string类型，因此不能将其更改为字符串数组。如果这样做，您将得到以下错误：

Type 'string[]' is not assignable to type 'string'.ts(2322)

相反，可以尝试这样的方法：

const routes: Routes = [
    {
        path: 'Data/:EntityID/:Date',
        component: MyFormComponent,`children`:[
            {
                path: '',
                loadChildren: () => import('../data-entry/data-entry.module').then(m => m.DataEntryModule)
            }
        ], 
    } ,
    { 
        path: 'Settings/:EntityID/:Date',
        redirectTo: 'Data/:EntityID/:Date', pathMatch: 'full'
    }
...
];

这样，至少不会重复组件和子部件。