Вызов REST не работает при обновлении компонента через RouteParam

Question

У меня есть простое приложение Angular, которое использует параметры маршрута в качестве наблюдаемой, поэтому содержимое моего компонента обновляется при изменении идентификатора маршрута. Я могу отслеживать идентификатор маршрута обновления в моем компоненте по мере необходимости, поэтому компонент обновляется по мере необходимости, но я не могу одновременно выполнить вызов REST для обновления содержимого, и именно отсюда в конечном итоге поступит большая часть моего содержимого.

Вот код в областях, имеющих отношение к проблеме:

menu.component. html использует индекс элемента в качестве идентификатора для передачи на content.component .ts

<div>
    <h3>Lesson Links</h3>
    <div class="row">
      <div class="col-sm-4" *ngFor="let menu of menus | async; index as id">
        <div class="card">
          <div class="card-body">
            <a [routerLink]="['/content',id]">{{menu.lessonName}}</a>
          </div>
        </div>
      </div>
    </div>
</div>

content.component.ts 'захватывает' идентификатор из routerLink в menu.component. html

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-content',
  templateUrl: './content.component.html',
  styleUrls: ['./content.component.css']
})
export class ContentComponent implements OnInit {
id: string;
content;
url = 'api address'
  constructor(private route: ActivatedRoute, private http: HttpClient) { }

  ngOnInit(){ 
    this.route.paramMap.subscribe(params => {
    console.log(params.get('id')); //for logging id (Ill eventually pass the id to the api url)
    this.id = params.get('id');
    this.getContent(); //this isnt getting called each time, but the id from above is logging each time the menu item is clicked.  
  });
  }
  getContent(){
    this.content = this.http.get(this.url); 
  }
}

Answer 1

Вам необходимо подписаться на метод http get (см. Фрагмент кода ниже). Также go через документацию: https://angular.io/guide/http

ngOnInit() {
  this.route.paramMap.subscribe(params => {
    console.log(params.get('id')); //for logging id (Ill eventually pass the id to the api url)
    this.id = params.get('id');
    this.getContent().subscribe({
      next: (response) => {
        this.content = response; // you can manipulate the response before assigning it directly to this.content
      }
    });
  });
}
getContent() {
  return this.http.get(this.url);
}