在父api Angular之后调用子api

import { Component, ViewChild } from '@angular/core';
import { ParentApiService } from 'parent-api.service';
import { ChildComponent } from 'child.component';

@Component({
  selector: 'app-parent',
  template: `
    <div>
      <button (click)="fetchParentData()">Fetch Parent Data</button>
      <button (click)="callChildApi()">Call Child API</button>
    </div>
    <app-child></app-child>
  `,
})
export class ParentComponent {
  parentData: any;
  @ViewChild(ChildComponent) childComponent: ChildComponent;

  constructor(private parentApiService: ParentApiService) {}

  fetchParentData() {
    this.parentApiService.getData().subscribe((data) => {
      this.parentData = data;
    });
  }

  callChildApi() {
    if (this.childComponent) {
      this.childComponent.fetchChildData(this.parentData);
    }
  }
}

import { Component } from '@angular/core';
import { ChildApiService } from 'child-api.service';

@Component({
  selector: 'app-child',
  template: `
    <div>
      <button (click)="fetchChildData()">Fetch Child Data</button>
    </div>
  `,
})
export class ChildComponent {
  constructor(private childApiService: ChildApiService) {}

  fetchChildData(parentData: any) {
    // 使用父组件传递的数据进行子组件的API请求
    this.childApiService.getData(parentData).subscribe((data) => {
      // 处理子组件的数据
    });
  }
}