如何在订阅httpClient observables后才能从父组件方法调用子组件方法？

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

@Component({
  selector: 'app-parent',
  template: `
    <app-child (onDataReceived)="handleData($event)"></app-child>
  `,
})
export class ParentComponent {
  private dataSubject = new Subject<string>();

  constructor(private http: HttpClient) {}

  fetchData() {
    this.http.get('https://api.example.com/data').subscribe((data: string) => {
      // 在订阅回调函数中调用子组件方法，并传递数据
      this.dataSubject.next(data);
    });
  }

  handleData(data: string) {
    // 处理从子组件接收到的数据
    console.log(data);
  }
}

import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'app-child',
  template: `
    <button (click)="handleClick()">调用子组件方法</button>
  `,
})
export class ChildComponent {
  @Output() onDataReceived = new EventEmitter<string>();

  handleClick() {
    // 子组件方法被调用时，触发事件，并传递数据给父组件
    this.onDataReceived.emit('Hello from child component!');
  }
}