在angular中使用(change)调用多个API

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-root',
  template: `
    <input type="text" [(ngModel)]="searchTerm" (change)="onSearchChange()" placeholder="Search...">
  `
})
export class AppComponent {
  searchTerm: string = '';

  constructor(private http: HttpClient) {}

  onSearchChange() {
    if (this.searchTerm) {
      this.fetchDataFromAPI1(this.searchTerm);
      this.fetchDataFromAPI2(this.searchTerm);
    }
  }

  fetchDataFromAPI1(term: string) {
    this.http.get(`https://api.example.com/data1?search=${term}`).subscribe(response => {
      console.log('Data from API 1:', response);
    });
  }

  fetchDataFromAPI2(term: string) {
    this.http.get(`https://api.example.com/data2?search=${term}`).subscribe(response => {
      console.log('Data from API 2:', response);
    });
  }
}