Is it possible to have multiple level Nested Route in Angular2

好久不见. 提交于 2019-12-24 16:40:34

问题


Is it possible to have multiple level nesting for angular routing. I am trying to achieve below but it says [Child routes are not allowed for "/cash/..". Use "..." on the parent's route path].

Intended route

/storeselector /forms - shows all forms /forms/cash/ - user select cash form from list of forms and on load it will shows all orders /forms/cash/id:1/ shows order details /forms/cash/edit/1 edit order 1

below is my code.

app component

@Component({
    selector : 'forms-app',
    templateUrl : 'app/app.component.html', 
    styleUrls : ['app/app.component.css'],
    directives: [ROUTER_DIRECTIVES],
    providers: [HTTP_PROVIDERS]
})
@RouteConfig([
  { path: '/storeselector', name: 'StoreSelector', component: StoreSelectorComponent, useAsDefault: true },
  { path: '/forms/...', name: 'Forms', component: FormsComponent }
])

forms component

@Component({
    selector : 'forms-root',
    template: '<router-outlet></router-outlet>',
    directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
  { path: '/', name: 'Forms', component:FormsListComponent, useAsDefault: true },
    { path: '/cash/..', name: 'CashForm', component:CashFormOrderComponent, useAsDefault: false}
])
export class FormsComponent {
  constructor(private _logger : LogService) {
    this._logger.info("FormsComponent loaded");
  }
}

cashform components
@Component({
    selector : 'forms-cash',
    template: '<div></div>',
    directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
  { path: '/', name: 'Orders', component:CashOrdersListComponent, useAsDefault: true },
    { path: '/:id', name: 'Order', component:CashOrderComponent },
  { path: '/edit/:id', name: 'Order', component:CashOrderComponent  }
])
export class CashFormOrderComponent {
  constructor(private _logger : LogService) {
    this._logger.info("CashFormOrderComponent loaded");
  }
}

回答1:


{ path: '/cash/..', name

should be

{ path: '/cash/...', name

To indicate there are child routes 3 . are required



来源:https://stackoverflow.com/questions/37050283/is-it-possible-to-have-multiple-level-nested-route-in-angular2

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!