Angular 找不到名称'；paramMap'；

我正在关注一个在线教程，并复制了下面的代码，该代码似乎适用于导师，但我收到一条错误消息：

找不到名称“paramMap”

我似乎无法在网上找到解决方案

import { Component, OnDestroy, OnInit } from '@angular/core';
import { News } from '../news.model';
import { NewsService } from '../news.service';
import { Subscription } from 'rxjs';
import { ParamMap } from '@angular/router';


@Component({
selector: 'app-news-detail',
templateUrl: './news-detail.page.html',
styleUrls: ['./news-detail.page.scss'],
})
export class NewsDetailPage implements OnInit, OnDestroy {
news: News;
private newsSub: Subscription;

constructor(
private NewsService: NewsService
) { }

ngOnInit() {
this.newsSub = this.NewsService.getNews(paramMap.get('newsId')).subscribe(news => {
  this.news = news;
});

}
ngOnDestroy() {
if (this.newsSub) {
this.newsSub.unsubscribe();
}
}}

如果您有任何想法，我们将不胜感激，并提前表示感谢

教程代码是

import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import {
NavController,
ModalController,
ActionSheetController
} from '@ionic/angular';
import { Subscription } from 'rxjs';
import { PlacesService } from '../../places.service';
import { Place } from '../../place.model';
import { CreateBookingComponent } from '../../../bookings/create-    
booking/create-booking.component';

@Component({
selector: 'app-place-detail',
templateUrl: './place-detail.page.html',
styleUrls: ['./place-detail.page.scss']
})
export class PlaceDetailPage implements OnInit, OnDestroy {
place: Place;
private placeSub: Subscription;

constructor(
private navCtrl: NavController,
private route: ActivatedRoute,
private placesService: PlacesService,
private modalCtrl: ModalController,
private actionSheetCtrl: ActionSheetController
) {}

ngOnInit() {
this.route.paramMap.subscribe(paramMap => {
  if (!paramMap.has('placeId')) {
    this.navCtrl.navigateBack('/places/tabs/discover');
    return;
  }
  this.placeSub = this.placesService
    .getPlace(paramMap.get('placeId'))
    .subscribe(place => {
      this.place = place;
    });
});
}

onBookPlace() {
// this.router.navigateByUrl('/places/tabs/discover');
// this.navCtrl.navigateBack('/places/tabs/discover');
// this.navCtrl.pop();
this.actionSheetCtrl
  .create({
    header: 'Choose an Action',
    buttons: [
      {
        text: 'Select Date',
        handler: () => {
          this.openBookingModal('select');
        }
      },
      {
        text: 'Random Date',
        handler: () => {
          this.openBookingModal('random');
        }
      },
      {
        text: 'Cancel',
        role: 'cancel'
      }
    ]
  })
  .then(actionSheetEl => {
    actionSheetEl.present();
  });
}

openBookingModal(mode: 'select' | 'random') {
console.log(mode);
this.modalCtrl
  .create({
    component: CreateBookingComponent,
    componentProps: { selectedPlace: this.place, selectedMode: mode }
  })
  .then(modalEl => {
    modalEl.present();
    return modalEl.onDidDismiss();
  })
  .then(resultData => {
    console.log(resultData.data, resultData.role);
    if (resultData.role === 'confirm') {
      console.log('BOOKED!');
    }
  });
}

ngOnDestroy() {
if (this.placeSub) {
  this.placeSub.unsubscribe();
}
}
}

---

我遗漏了什么吗？

发生错误是因为跳过了导师代码中提供

paramMap

参数的部分。而且它不必命名为

paramMap

。它只是一个参数，你可以给它取任何你想要的名字。注意，我在下面的代码中将其命名为

xyz

ActivatedRoute

有一个名为

paramMap

的属性，如果您订阅该属性（调用其上的

subscribe（）

方法），您将收到路由参数中的任何更改。您没有在代码中添加

ActivatedRoute

，并跳过订阅其

paramMap

将

ActivatedRoute

服务添加到构造函数中-

constructor(
private route: ActivatedRoute,
private NewsService: NewsService
) { }

然后修改

ngOnInit

方法，如下所示-

ngOnInit() {
    this.route.paramMap.subscribe(xyz => {
        this.newsSub = this.NewsService.getNews(xyz.get('newsId')).subscribe(news => {
            this.news = news;       
        })
    });
}

---

此代码无法工作，未定义paramMap。你确定这是本教程的最后一段代码吗？我没有在你的代码中定义任何

paramMap

。导入了一个

ParamMap

，但由于typescript区分大小写，这是两件不同的事情。我不确定这个

ParamMap

是否就是您想要使用的东西感谢您的关注，我已经添加了教程代码，可能我错过了一些东西！一些代码尚未涵盖，因此我已经包括在内。

ParamMap

是

this.route.ParamMap

的类型

paramMap

也是回调函数的参数。啊，感谢您的澄清！