Angular 角度6:搜索当前路线中的特定单词
我有这个路由表:Angular 角度6:搜索当前路线中的特定单词,angular,typescript,routing,routes,parent-child,Angular,Typescript,Routing,Routes,Parent Child,我有这个路由表: //路由数组-设置每个html页面的路由 施工许可:路线=[ {路径:'',重定向到:'/courses',路径匹配:'full'}, {路径:'courses',组件:CourseListComponent,路径匹配:'full'}, {path:'courses/:id',component:CourseDetailComponent,pathMatch:'full'}, {path:'courses/:id/unit/:unitId',component:CourseP
//路由数组-设置每个html页面的路由
施工许可:路线=[
{路径:'',重定向到:'/courses',路径匹配:'full'},
{路径:'courses',组件:CourseListComponent,路径匹配:'full'},
{path:'courses/:id',component:CourseDetailComponent,pathMatch:'full'},
{path:'courses/:id/unit/:unitId',component:CoursePlayComponent,
儿童:[
{路径:'',组件:CourseListComponent},
{路径:'lesson/:lessonId',组件:CourseSelessonComponent,数据:'lesson},
{路径:'quick/:quizId',组件:CourseQuizComponent,数据:'quick,}
]},
{路径:'**',组件:PageNotFoundComponent,路径匹配:'full'}]代码>这是一种可能的方法(在组件的ngOnInit
中),此路由将作为激活的路由注入到构造函数中
:
import { ActivatedRoute, UrlSegment } from '@angular/router';
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.route.url.subscribe((urlSegments: UrlSegment[]) => {
switch (urlSegments[4].path) {
case 'lesson':
// ...
break;
case 'quiz':
// ...
}
});
}
编辑:刚刚意识到您使用的是子组件,我不确定在这种情况下分段的行为。试一试,如果不行,我会删除这个答案。您是否考虑过使用路由的数据属性,而不是搜索特定文本?它仍然使用route.snapshot,尽管它比搜索字符串更好,尤其是当变量是路由的一部分时。看,我会看,但我用垫子边栏和身体的变化取决于孩子们。课程正在进行,但测验没有。当我输入这个路径“courses/3/unit/1/quick/1”时,它正在加载一个课程而不是一个测验。当我单击侧栏中的测验时,测验显示在课程下方,而不是正文中的测验。我尝试过这样做,但它说它未定义(我也添加到表根数据中):route.url.subscribe(()=>{console.log(route.snapshot.children.data);});什么是片段和UrlSegments?对不起,片段我指的也是片段。片段是/of/the/route/URL的一部分。我将尝试使用您编写的内容并告诉您它是否有效。我尝试使用路由表中的数据并访问children.data,但它未定义。我还编辑了源代码,请随意使用console.log(UrlSegments)
查看它的外观。您可能需要进行一些小的调整。好的,那么子例程的段在这里似乎不可用,因此这将不起作用。对此表示抱歉!