错误

Question

我想设置为我的应用程序页面导航的路线，但得到以下错误：

ERROR in C:/my-app/src/app/router.component.ts (9,2): Type '({ Path: string; redirectTo: string; PathMatch: string; } | { Path: string; component: typeof Abo...' is not assignable to type 'Route[]'. Type '{ Path: string; redirectTo: string; PathMatch: string; } | { Path: string; component: typeof Abou...' is not assignable to type 'Route'.

代码：

export const router: Routes=[ 
    {Path:'', redirectTo:'about', PathMatch:'full'}, 
    {Path:'about', component:AboutComponent}, 
    {Path:'products', component:ProductsComponent}, 
]; 

Answer 1

尝试没有大写：

export const router: Routes=[ 
    {path:'', redirectTo:'about', pathMatch:'full'}, 
    {path:'about', component: AboutComponent}, 
    {path:'products', component: ProductsComponent}, 

    ]; 

Answer 2

当您看到这些is not assignable to type 'X'异常时，这是因为对象字面值的结构不匹配分配结构（区分大小写）。

export 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; 
} 

与在JavaScript中，path和pathMatch在驼峰定义的大多数属性：当我们检查路由接口，该变得清晰。

export const router: Routes = [ 
    {path:'', redirectTo:'about', pathMatch:'full'}, 
    {path:'about', component:AboutComponent}, 
    {path:'products', component:ProductsComponent} 
];