“ActivatedRoute”类型上不存在属性“paramMap”。 /node_modules/@angular/router/index"' 没有导出成员 'ParamMap'答案

【问题标题】：Property 'paramMap' does not exist on type 'ActivatedRoute'. /node_modules/@angular/router/index"' has no exported member 'ParamMap'“ActivatedRoute”类型上不存在属性“paramMap”。 /node_modules/@angular/router/index"' 没有导出成员 'ParamMap'
【发布时间】：2017-07-29 11:18:39
【问题描述】：

hero-detail.component.ts

import { Component, Input, OnInit } from '@angular/core';
import 'rxjs/add/operator/switchMap';
import { ActivatedRoute} from '@angular/router';
import {  ParamMap } from '@angular/router';
import { Location }                 from '@angular/common';
import { Hero } from '../hero';
import { HeroService } from '../services/hero.service';

@Component({
  selector: 'app-hero-detail',
  templateUrl: './hero-detail.component.html',
  styleUrls: ['./hero-detail.component.css']
})
export class HeroDetailComponent implements OnInit {

  @Input() hero: Hero;

  constructor(
    private heroService: HeroService,
  private route: ActivatedRoute,
  private location: Location
  ) { }

  ngOnInit(): void {
  this.route.paramMap
    .switchMap((params: ParamMap) =>     this.heroService.getHero(+params.get('id')))
    .subscribe(hero => this.hero = hero);
}

goBack(): void {
  this.location.back();
}

}

错误：1> node_modules/@angular/router/index"' 没有导出的成员 'ParamMap'。

2> 类型“ActivatedRoute”上不存在属性“paramMap”。

【问题讨论】：

标签： angular angular-routing angular-router

【解决方案1】：

ParamMap 已在4.0.0-rc.6 版本中引入。确保您至少拥有 Angular 4 版本。

【讨论】：

什么是 angular 2 等价物？
@Ring 你为什么要回退版本？？

【解决方案2】：

在最新版本的 angular 即 2.4.10 中获取 ID 您可以简单地使用

const id = +this.route.snapshot.params['id'];

【讨论】：

现在最好的做法是：const id = this.route.snapshot.paramMap.get('id');

【解决方案3】：

这个问题可能是角度版本冲突。您的版本可能低于 4.0.0-rc.6 这种方法可能有助于解决以前的问题

在参数发送组件中添加以下行：

this.router.navigate(['profile'],{queryParams:{authdata:email}});

在参数接收组件中添加下面一行：

this.route.snapshot.queryParams['authdata'];

路由器模块的下面一行： { 路径：'个人资料'，组件：配置文件组件 }

【讨论】：

【解决方案4】：

在最新版本上，您现在可以编写：

import { ActivatedRoute } from '@angular/router';
//...
constructor(private activatedRoute: ActivatedRoute) {}
//...
ngOnInit() {
    const id = this.activatedRoute.snapshot.paramMap.get('id');
    if (id) {
        console.log ('id parameter: ', id);
    } else {
          console.log ('no id parameter');
    }
}

希望对你有帮助。

【讨论】：

【解决方案5】：

我在 Angular 教程中遇到了类似的问题，需要在 hero-detail.component.ts 中更改此代码：

getHero(): void {
    const id = +this.route.snapshot.paramMap.get('id');
    this.heroService.getHero(id)
        .subscribe(hero => this.hero = hero);
}

到这个：

getHero(): void {
    const id= +this.route.snapshot.params['id'];
    this.heroService.getHero(id)
      .subscribe(hero => this.hero = hero);
}

【讨论】：