angular - 使用 Angular 获取路由参数的最佳方法

Question

在当前路由（使用 ActivatedRoute 或 Router）中获取我的 id 值的最佳方法是什么？并解释原因:)

n°1

constructor(private route: ActivatedRoute) {}

ngOnInit() {
  this.id = this.route.snapshot.params['id']
}

n°2

constructor(private router: Router) {}

ngOnInit() {
 this.id = this.router.url.includes('id')
}

Answer 1

最好订阅paramMap

ngOnInit() {
  this.route.paramMap.subscribe(params => {
    this.id= params.get('id');
  });
}

Answer 2

首先在你的构造函数中声明来自'@angular/router'的ActivatedRoute；

constructor ( private route: ActivatedRoute ){}

然后通过使用此代码，您将获得查询参数

this.route.queryParams.subscribe(params =>{ let Id = params ["Id"]; }

Answer 3

您需要取消订阅您订阅的任何内容以防止内存泄漏。

paramsSubscription$: Subscription;
id: string;

constructor(private route: ActivatedRoute, private router: Router) {}

ngOnInit() {
  this.paramsSubscription$ = this.route.paramMap.subscribe(
    (params: ParamMap) => {
      this.id = params.get("id");
  });
}

ngOnDestroy() {
  if (this.paramsSubscription$) this.paramsSubscription$.unsubscribe();
}

Answer 4

this.route.params.forEach((params: Params) => {
    const id = +params['id'];
    // more stuff
});

Answer 5

在组件中导入路由器。

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

在构造函数中传递它

private router : Router

现在这将给出路由器参数

this.router.url;