在angular 7中如何在一个组件中进行更改时更新另一个组件中的数据

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class DataSharingService {
  private dataSubject = new BehaviorSubject<string>(''); // 初始化一个BehaviorSubject，用于存储共享数据
  public data$ = this.dataSubject.asObservable(); // 创建一个Observable，用于订阅共享数据的变化

  constructor() { }

  updateData(newData: string) {
    this.dataSubject.next(newData); // 更新共享数据
  }
}

import { Component, OnInit } from '@angular/core';
import { DataSharingService } from '路径/DataSharingService';

@Component({
  selector: 'app-component1',
  template: `
    <div>
      <input [(ngModel)]="sharedData" (ngModelChange)="updateSharedData()" placeholder="输入共享数据">
    </div>
  `,
})
export class Component1 implements OnInit {
  sharedData: string;

  constructor(private dataSharingService: DataSharingService) { }

  ngOnInit() {
    this.dataSharingService.data$.subscribe(data => {
      this.sharedData = data; // 订阅共享数据的变化
    });
  }

  updateSharedData() {
    this.dataSharingService.updateData(this.sharedData); // 更新共享数据
  }
}

import { Component, OnInit } from '@angular/core';
import { DataSharingService } from '路径/DataSharingService';

@Component({
  selector: 'app-component2',
  template: `
    <div>
      <button (click)="updateSharedData()">更新共享数据</button>
    </div>
  `,
})
export class Component2 implements OnInit {

  constructor(private dataSharingService: DataSharingService) { }

  ngOnInit() {
  }

  updateSharedData() {
    const newData = '新的共享数据';
    this.dataSharingService.updateData(newData); // 更新共享数据
  }
}