1 创建组件addnews

ng g component zujian/addnews

2 我想让http://localhost:4200/news/add能访问到news的子路由addnews,路由配置app-routing.module.ts如下:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import {HomeComponent} from './zujian/home/home.component';
import {NewsComponent} from './zujian/news/news.component';
import {NewscontentComponent} from './zujian/newscontent/newscontent.component';
import { AddnewsComponent } from './zujian/addnews/addnews.component';//引入组件
const routes: Routes = [
  {path: 'home', component: HomeComponent},
  {path: 'news', component: NewsComponent,
//配置子路由
    children:[{
      path:'add',
      component:AddnewsComponent
      }]

},
  {path: 'newscontent/:id', component: NewscontentComponent},
  {
      path: '**',/*匹配不到的任意的路由*/
      redirectTo: '/home',
      pathMatch: 'full'
    } 
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

3 news.component.html加上:

<router-outlet></router-outlet>