angular 路径参数和查询参数

总结一下路径参数和查询参数，为了方便大家对比观察 写在一起方便对比

路径参数的配置--查询参数的配置

{ path: ':tabLink',component: HomeDetailComponent,}

{path: 'home',component: HomeContainerComponent,}

路径参数的跳转--查询参数的跳转

1.<a [routerLink]="['/home',tablink]"></a>
2.this.router.navigate(['home',tablink])

1.<a [routerLink]="['/home']" [queryParams={name:'val1'}]></a>
2.this.router.navigate(['home'],{queryParams:{name:'val1'}});

Url表现形式

http://localhost:4200/home/men

http://localhost:4200/home?product=watch

读取

    this.route.paramMap.subscribe(params => {
      console.log('路径参数: ', params);
      this.selectedTabLink = params.get('tabLink');
    });