Angular2 中是否可以有多个级别的嵌套路由 [英] Is it possible to have multiple level Nested Route in Angular2
本文介绍了Angular2 中是否可以有多个级别的嵌套路由的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
是否可以为角度路由进行多级嵌套.我试图在下面实现,但它说 [/cash/.."不允许使用子路由.在父路径路径上使用..."].
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].
预定路线
/商店选择器/forms - 显示所有表格/forms/cash/- 用户从表格列表中选择现金表格并在加载时显示所有订单/forms/cash/id:1/显示订单详情/forms/cash/edit/1 编辑订单 1
/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
下面是我的代码.
应用组件
@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");
}
}
推荐答案
{ path: '/cash/..', name
应该是
{ path: '/cash/...', name
表示有子路由 3 .
是必需的
To indicate there are child routes 3 .
are required
这篇关于Angular2 中是否可以有多个级别的嵌套路由的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文