Javascript 向Web服务发送URL参数

为TOH前端创建了后端。GetHeroes（）工作正常，因此基本管道已安装到位

无法将id传递到GetHero（id:number）

Postman获取以下url并返回

http://192.168.1.125:4200/hero-detail/23  >>>>    { "id": 23, "name": "Celeritas1" }

这是英雄细节.component.ts中的ngOnInit

 ngOnInit(): void {
    console.log('***' + this.route.params[0]);
        this.route.params
        .switchMap((params: Params) => this.heroService.getHero(+params['id']))
    }

这是hero.service.ts中的GetHero（）函数 似乎没有调用console.log。 我在web控制台或ng命令行窗口中没有收到错误

private heroesUrl = 'http://localhost:4300/api/heroes';  // URL to web api

 getHero(id: number): Observable<Hero> {
    console.log("enter service.getHero");
   const url = `${this.heroesUrl}/${id}`;
    return this.http.get<Hero>(url).pipe(
      tap(_ => this.log(`fetched hero id=${id}`)),
      catchError(this.handleError<Hero>(`getHero id=${id}`))
    );
  }

---

我的问题是：似乎启动w/switchMap的语句出错了，没有调用服务。我该怎么纠正这个错误呢。和/或我如何使用console.log引用Param数组来进一步诊断问题。

我在OP上的评论-下面是快照路由的示例。如果

id

是动态的，则应使用

可观察的

在这里找到答案


不知道我看的时候是哪个版本的TOH。我猜[]在某种程度上是一种有效的访问语法
 console.log（'***'+this.route.snapshot.params.id）；>>23，但我想我读到的快照并不是您真正想要使用的。访问英雄21和23将被缓存…您的url是如何构造的？您正在使用querystring参数吗？您设置了什么样的路由机制？您是否使用
routerLink
构建URL？需要更多信息…顺便说一句，你可以设置你的url参数来订阅一个可观察的，如果你认为他们会改变…所以要使用你的
id
，用快照弹出它或者订阅一个可观察的，就像我在上一篇评论中说的。然后将其传递到您的服务中，并对返回的数据执行任何需要的操作。fwiw-我询问您的url是如何构造的原因是，无论您在路由器中为参数指定什么名称，都会影响到在组件上检索该参数的值。。。
 console.log('***' + this.route.params[0]);     >>>    ***undefined

console.log('***' + this.route.params['id']);     >>>    ***undefined

console.log('***' + this.route.params );  >>>  ***[Object][Object]

ngOnInit(): void {
    let id = +this.route.snapshot.paramMap.get('id'); // coerce your id to a number since that's what your service expects
        this.route.params
        .switchMap((params: Params) => this.heroService.getHero(id))
    }

ngOnInit(): void {
    var hId: Number;
    this.route.paramMap.subscribe(params => {
      console.log( + params.get('id'));
      hId = params.get('id');
    });
console.log(  hId);

        this.route.params
        .switchMap((params: Params) => this.heroService.getHero(+params.get('id')))
    }