子路由的角度4路由问题

时间:2017-10-10 08:03:27

标签: angular angular4-router

在我的angular 4应用程序中,我有一些路由问题,可能是我错了,目前问题是这样的路由path: ':code/copy',我可以正确地路由到这个组件但是当我我在里面,如果我重新加载页面,角度无法加载css文件。

在我的app.routing中我有一条路径:

path: 'ticketBundles',
loadChildren: './ticket-bundles/shared/ticket-bundle.module#TicketBundleModule'`

ticketBundles的结构是这样的:

ticketBundles

所以在我的票据包中。我有:

import {Routes} from '@angular/router';
import {TicketBundleListComponent} from '../ticket-bundle-list/ticket-bundle-list.component';
import {TicketBundleNewComponent} from '../ticket-bundle-new/ticket-bundle-new.component';
import {TicketBundleDetailComponent} from '../ticket-bundle-detail/ticket-bundle-detail.component'

export const TicketBundleRoutes: Routes = [
  {
    path: '',
    component: TicketBundleListComponent
  },
  {
    path: 'new',
    component: TicketBundleNewComponent
  },
  {
    path: ':code',
    component: TicketBundleDetailComponent,
  },
  {
    path: ':code/copy',
    component: TicketBundleNewComponent
  }
];

如果我将这条路径作为孩子path: ':code/copy',我该如何路由它?因为如果我这样做它就无法匹配任何路线。 要在某个组件中进行路由,请在ticket-bundlelist.component中执行:this.router.navigate(['/ticketBundles', code])

如前所述,我只对这条路线有问题::code/copy那么如何更正路由结构才能使其正常工作?

2 个答案:

答案 0 :(得分:0)

如果我正确理解您的问题,您应该重新排序路线。 Angular开始匹配从顶部开始的路线。

因此,在这种情况下,当您导航到:code / copy时,它将从第一个元素开始在TicketBundleRoutes中查找它。当它找到:code时,它将返回该路线并且不会进一步查看。将:code/copy移到:code路径上方,看看它是否有效。

答案 1 :(得分:0)

这完全是我的错,css路径错误,我使用了../assets,但正确的路径是/assets 但我不明白为什么它在所有页面中都有不正确的路径,除此之外,现在正确的路径工作正常