首页 > 解决方案 > 如何从 Angular ActivatedRoute 获取参数

问题描述

我正在尝试使用 observables 从我激活的路由中获取参数 :id 。当我在控制台上打印参数时,我得到了正确的值:id。但 this.id 并非如此。我得到值 NaN。你能告诉我有什么问题吗

export class RecipeEditComponent implements OnInit {
  id: number;
  editMode = false;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.route.params.subscribe(
      (params: {id: string}) => {
        this.id = +params.id;
        console.log(this.id);
      }
    );
}
}

标签: angularparametersrouting

解决方案


更改为this.id = +params.get('id')

您应该使用该方法get(),因为它为给定的参数返回单个值id。您收到错误,因为params它不是id作为值的键。

export class RecipeEditComponent implements OnInit {
  id: number;
  editMode = false;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
  // paramMap replaces params in Angular v4+
   this.route.paramMap.subscribe(params: ParamMap => {
        this.id = +params.get('id');
        console.log(this.id);     
  });
}

推荐阅读