angular pass get paragrams by router

希望在父组件中点击列表item,根据item不同参数启动不同的子组件component 并传入不同的参数。

现在实验出两种等价方式

设置子组件路由app-routing.module.ts

const routes: Routes = [
  {path: 'envelope', component: EnvelopeComponent },
];

1 父组件

import { Router } from '@angular/router';
......

export class AppComponent {

  constructor(
    private router: Router,
    ){}

    ......
  onSelectedItem(event){
    console.log('onSelectedItem', event.data)
    //this.uid_selected_from_table = event.data["uid"]
    //成绩详情跳转到别的路由 2种写法,接收时不同
    //this.router.navigate(['/envelope'], {queryParams:event.data})
    this.router.navigate(['/envelope', event.data]);
  }

  }
}

2子组件  

import {ActivatedRoute} from '@angular/router';
.....
export class EnvelopeComponent implements OnInit {

  constructor(private actived_route: ActivatedRoute) {
    // this.actived_route.queryParams.subscribe(d=>{
    this.actived_route.params.subscribe(d=>{
      console.log('参数', d)
    })

   }
}
—————————————
原文地址:https://www.cnblogs.com/xuanmanstein/p/15292139.html