我在我的应用程序中使用路由,并且在应用程序中工作正常,然后我需要添加一个页面,该页面也可以工作,但是当我设置为该页面的root时,它会显示
Error: Cannot match any routes URL Segment: 'tabs/categories'
App.routing.module
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { OrderSummaryPage } from './checkout/order-summary/order-summary.page';
import { StartPage } from '../app/start/start.page';
const routes: Routes = [
{ path: '', component: StartPage },
{ path: 'cat', loadChildren: './tabs/tabs.module#TabsPageModule', },
{ path: 'order-summary/:id', component: OrderSummaryPage },
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule {}
如果删除cat并完美地将其加载选项卡页面设置为第一条路线,则可以正常工作,但是我需要先显示开始页面,然后再设置该选项卡页面。我已经做到了,但是显示错误
我只是这样设置路线
<div class="content" routerLink="/cat" routerDirection="root"><img id="myImage" src="assets/image/logo.png"></div>
这是我的tabs.router.module.ts
const routes: Routes = [
{
path: 'tabs',
component: TabsPage,
children: [
{
path: 'home',
children: [
{
path: '',
component: HomePage,
},
{
path: 'products/:id',
children: [
{
path: '',
component: ProductsPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
},
{
path: 'vendor-products',
children: [
{
path: '',
component: ProductsPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
},
{
path: 'post/:id',
component: PostPage
}
]
},
{
path: 'categories',
children: [
{
path: '',
component: CategoriesPage
},
{
path: 'products/:id',
children: [
{
path: '',
component: ProductsPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
},
{
path: 'vendor-products',
children: [
{
path: '',
component: ProductsPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
}
]
},
{
path: 'search',
children: [
{
path: '',
component: SearchPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
},
{
path: 'vendor-products',
children: [
{
path: '',
component: ProductsPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductsPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
}
]
},
{
path: 'cart',
children: [
{
path: '',
component: CartPage
},
{
path: 'address',
component: CheckoutAddressPage
},
{
path: 'checkout',
component: CheckoutPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
},
{
path: 'account',
children: [
{
path: '',
component: AccountPage
},
{
path: 'address',
children: [
{
path: '',
component: AddressPage
},
{
path: 'edit-address',
component:EditAddressPage
}
]
},
{
path: 'register',
component: RegisterPage
},
{
path: 'points',
component: PointsPage
},
{
path: 'setting',
component: SettingPage
},
{
path: 'currencies',
component: CurrenciesPage
},
{
path: 'wallet',
children: [
{
path: '',
component: WalletPage
},
{
path: 'cart',
component: CartPage
}
]
},
{
path: 'post/:id',
component: PostPage
},
{
path: 'map',
component: MapPage
},
{
path: 'orders',
children: [
{
path: '',
component: OrdersPage
},
{
path: 'order/:id',
component: OrderPage
}
]
},
{
path: 'login',
children: [
{
path: '',
component: LoginPage
},
{
path: 'forgotten',
component: ForgottenPage
}
]
},
{
path: 'wishlist',
children: [
{
path: '',
component: WishlistPage
},
{
path: 'product/:id',
children: [
{
path: '',
component: ProductPage
},
{
path: 'review/:id',
component: ReviewPage
}
]
}
]
},
{
path: 'blogs',
children: [
{
path: '',
component: BlogsPage
},
{
path: 'blog/:id',
component: BlogPage
}
]
},
]
},
{
path: '',
redirectTo: '/tabs/categories',
pathMatch: 'full'
}
]
},
{
path: '',
redirectTo: '/tabs/categories',
pathMatch: 'full'
}
];