Angular 路由传参数

Angular路由传参

配置路由

通过 descr/1 等形式访问 DescrComponent,此时 1 为携带参数。

    { path: 'descr/:id', component: DescrComponent},
    { path:'position/:id',component:PositionAnalysisComponent},

访问模块

infor?.compPosition 为动态改变的参数,当通过该路由访问成功时,浏览器中的URL变为 position/1201

    <p  [routerLink]="['/position', infor?.cmpId]" class="position ">
         {{infor?.compPosition}}
         <span class="salary">{{infor?.compSalary}}</span>
    </p>

获取参数


1 .注入ActivatedRoute

queryParams() 中的参数是配置路由时的路径

import {ActivatedRoute, Params} from '@angular/router';
    id:string;
    constructor(private activatedRout: ActivatedRoute) {}
    this.id = this.activatedRout.snapshot.queryParams['id'];

2 .其余方法

获取路由参数

猜你喜欢

转载自blog.csdn.net/ai_shuyingzhixia/article/details/79956861