无法匹配任何路线：''

Question

我在 angular2 应用程序中有一个定义的路由并收到这样的错误：

无法匹配任何路由：''

export const routes: Routes = [{
  path: '',
  component: MainComponent,

  children: [{
    path: 'callCenter',
    component: CallCenterComponent,
    resolve: {
      countries: CountriesResolver
    },
  }, {
    path: 'vehicle',
    component: VehicleComponent,
    resolve: {
      vehicleCategories: VehicleCategoryResolver,
      vehicleOptions: VehicleOptionResolver
    },
  }, {
    path: 'territory',
    component: TerritoryComponent,
    resolve: {
      territoryOptions: TerritoryOptionResolver
    }
  },{
    path: 'token',
    component: TokenGenerationComponent
  }, {
    path: 'rider',
    component: RiderComponent
  }, {
    path: 'dispatch',
    component: DispatchSchemaComponent,
    resolve: {
      dispatchOrders: DispatchOrderResolver,
      dispatchModes: DispatchModeResolver
    }
  }]
}, {
  path: 'login',
  component: LoginComponent
}];

这是我的路由配置代码。我使它与示例中的相同，但它不起作用，redirectTo 属性也无济于事。默认空路由不加载。谁能帮帮我？

Answer 1

我相信 angular 期望 MainComponent 子路由具有路径为 '' 的路由。

 export const routes: Routes = [{
  path: '',
  component: MainComponent,

  children: [{
      path: '',
      component: SomeComponent
     },
     {
     path: 'callCenter',
     component: CallCenterComponent,
     resolve: {
      countries: CountriesResolver
    },
  }, {
    path: 'vehicle',
    component: VehicleComponent,
    resolve: {
      vehicleCategories: VehicleCategoryResolver,
      vehicleOptions: VehicleOptionResolver
    },
  }, {
    path: 'territory',
    component: TerritoryComponent,
    resolve: {
      territoryOptions: TerritoryOptionResolver
    }
  },{
    path: 'token',
    component: TokenGenerationComponent
  }, {
    path: 'rider',
    component: RiderComponent
  }, {
    path: 'dispatch',
    component: DispatchSchemaComponent,
    resolve: {
      dispatchOrders: DispatchOrderResolver,
      dispatchModes: DispatchModeResolver
    }
  }]
}, {
  path: 'login',
  component: LoginComponent
}];

编辑： 有一些重定向

export const routes: Routes = [
  {
    path: '',
    component: MainComponent,
    children: [
      {
        path: '',
        redirectTo: 'callCenter'
      },
      {
        path: 'callCenter',
        component: CallCenterComponent,
        resolve: {
          countries: CountriesResolver
        },
      }, {
        path: 'vehicle',
        component: VehicleComponent,
        resolve: {
          vehicleCategories: VehicleCategoryResolver,
          vehicleOptions: VehicleOptionResolver
        },
      }
    ...

将 MainComponent 移动到子路由也应该有效

export const routes: Routes = [
  {
    path: '',
    children: [
      {
        path: '',
        component: MainComponent
      },
      {
        path: 'callCenter',
        component: CallCenterComponent,
        resolve: {
          countries: CountriesResolver
        },
      }, {
        path: 'vehicle',
        component: VehicleComponent,
        resolve: {
          vehicleCategories: VehicleCategoryResolver,
          vehicleOptions: VehicleOptionResolver
        },
      }
    ...

无法匹配任何路线：''

Cannot match any routes: ''

angular

angular2-routing

angular2-router