Angular 4 中的子路由问题
child routing issue in Angular 4
我实现了子路由,但它给我错误,我什至无法打开我在代码中提到的父页面,这是我的代码,最后提到了错误
`import {Component} from '@angular/core';
@Component({
template:`<div style="width:350px;hight:200px;background-color:#00ff00">
<h1>Create Places</h1>
</div>
<a [routerLink]="['/placeDetail']">PlaceDetail</a>
<div>
<router-outlet></router-outlet>
</div>
`
})
export class PlaceComponent{}
`
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from '../app/components/dashboard.component';
import {NeighbourhoodComponent} from '../app/components/neighbourhood.component';
import {UserProfileComponent} from '../app/components/userProfile.component';
import {PlaceComponent} from '../app/components/place.component';
import {PlaceDetailComponent} from '../app/components/placeDetail.component';
const appRoutes: Routes = [
{
path: '',
redirectTo: 'dashboard',
pathMatch: 'full'
},
{
path: 'dashboard',
component: DashboardComponent
},
{
path:'neighbourhood',
component:NeighbourhoodComponent
},
{
path:'userprofile',
component:UserProfileComponent
},
{
path:'place',
component:PlaceComponent,
children:[
{
path:'placeDetail',
component:PlaceDetailComponent
}
]
}
];
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
一旦我点击 link 它应该转到 placeDetailComponent 但它给我错误
异常:未捕获(承诺):错误:无法匹配任何路由。 URL 段:'place'
问题已解决,我有 Angular 2.1,刚刚更新到 5,它正在运行。
我实现了子路由,但它给我错误,我什至无法打开我在代码中提到的父页面,这是我的代码,最后提到了错误
`import {Component} from '@angular/core';
@Component({
template:`<div style="width:350px;hight:200px;background-color:#00ff00">
<h1>Create Places</h1>
</div>
<a [routerLink]="['/placeDetail']">PlaceDetail</a>
<div>
<router-outlet></router-outlet>
</div>
`
})
export class PlaceComponent{}
`
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from '../app/components/dashboard.component';
import {NeighbourhoodComponent} from '../app/components/neighbourhood.component';
import {UserProfileComponent} from '../app/components/userProfile.component';
import {PlaceComponent} from '../app/components/place.component';
import {PlaceDetailComponent} from '../app/components/placeDetail.component';
const appRoutes: Routes = [
{
path: '',
redirectTo: 'dashboard',
pathMatch: 'full'
},
{
path: 'dashboard',
component: DashboardComponent
},
{
path:'neighbourhood',
component:NeighbourhoodComponent
},
{
path:'userprofile',
component:UserProfileComponent
},
{
path:'place',
component:PlaceComponent,
children:[
{
path:'placeDetail',
component:PlaceDetailComponent
}
]
}
];
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
一旦我点击 link 它应该转到 placeDetailComponent 但它给我错误
异常:未捕获(承诺):错误:无法匹配任何路由。 URL 段:'place'
问题已解决,我有 Angular 2.1,刚刚更新到 5,它正在运行。