① , 在news组件中有newsa 和 newsb2个子组件 . 排版如下所示 :
② , 分别创建出 news , newsa , newsb3个组件
{
path:"news" , component:NewsComponent,
children:[
{path:"newsa" , component:NewsaComponent},
{path:"newsb" , component:NewsbComponent},
{
path:"**",
redirectTo:"newsa"
}
]
},上面配置的意思很清楚:
① , 有一个news组件
② , news组件下面有2个子组件newsa , newsb
③ , 默认显示子组件是newsa
<div class="content">
<div class="left">
<a [routerLink]="['/news/newsa']" [routerLinkActive]="['active']">newsa</a>
<br>
<br>
<a [routerLink]="['/news/newsb']" [routerLinkActive]="['active']">newsb</a>
</div>
<div class="right">
<router-outlet></router-outlet>
</div>
</div>注意:
① , routerLink的写法 , 既然newsa/newsb为news的子组件 , 那么必须写成/news/newsa或者/news/newsb.这个和路由配置是对应的
② , 想要在<div class="right"></div>中显示newsa/newsb组件,必须在其中加入:
<router-outlet></router-outlet>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
