如何从angular 5中的其他组件更新组件数据

从Angular 5中的其他组件更新组件数据，可以通过以下几种方式实现：

1. 使用@Input和@Output装饰器：在目标组件中定义一个输入属性（@Input）和一个输出属性（@Output）。其他组件可以通过输入属性将数据传递给目标组件，而目标组件可以通过输出属性将更新后的数据传递回其他组件。这种方式适用于父子组件之间的通信。具体实现步骤如下：
   • 在目标组件中，使用@Input装饰器定义一个输入属性，例如：@Input() data: any;
   • 在其他组件中，通过属性绑定将数据传递给目标组件，例如：<app-target-component data="someData"></app-target-component>
   • 在目标组件中，通过@Output装饰器定义一个输出属性和一个事件，例如：@Output() dataUpdated: EventEmitter<any> = new EventEmitter<any>();
   • 在目标组件中，当需要更新数据时，调用事件的emit方法，例如：this.dataUpdated.emit(updatedData);
   • 在其他组件中，通过事件绑定监听目标组件的数据更新事件，例如：<app-target-component (dataUpdated)="handleDataUpdate($event)"></app-target-component>
   • 在其他组件中，实现一个处理数据更新的方法，例如：handleDataUpdate(updatedData: any) { // 处理更新后的数据 }
2. 使用服务（Service）：创建一个共享的服务，用于在组件之间传递和更新数据。其他组件可以通过依赖注入方式使用该服务，并调用其方法来更新数据。具体实现步骤如下：
   • 创建一个服务，例如：ng generate service dataService
   • 在服务中定义一个私有变量来存储数据，例如：private data: any;
   • 在服务中定义一个公共方法来获取数据，例如：getData(): any { return this.data; }
   • 在服务中定义一个公共方法来更新数据，例如：updateData(updatedData: any) { this.data = updatedData; }
   • 在其他组件中，通过依赖注入方式使用该服务，例如：constructor(private dataService: DataService) {}
   • 在其他组件中，通过调用服务的方法来获取和更新数据，例如：this.dataService.getData(); this.dataService.updateData(updatedData);
3. 使用RxJS的Subject或BehaviorSubject：创建一个Subject或BehaviorSubject对象，作为数据源，其他组件可以通过订阅该对象来获取数据，并通过next方法来更新数据。具体实现步骤如下：
   • 在一个共享的服务中创建一个Subject或BehaviorSubject对象，例如：private dataSubject: Subject<any> = new Subject<any>();
   • 在服务中定义一个公共方法来获取数据的Observable，例如：getData(): Observable<any> { return this.dataSubject.asObservable(); }
   • 在服务中定义一个公共方法来更新数据，例如：updateData(updatedData: any) { this.dataSubject.next(updatedData); }
   • 在其他组件中，通过依赖注入方式使用该服务，例如：constructor(private dataService: DataService) {}
   • 在其他组件中，通过订阅服务的数据Observable来获取数据，例如：this.dataService.getData().subscribe(data => { // 处理获取到的数据 });
   • 在其他组件中，通过调用服务的方法来更新数据，例如：this.dataService.updateData(updatedData);

以上是三种常用的方式，可以根据具体需求选择适合的方式来实现从Angular 5中的其他组件更新组件数据。对于更复杂的应用场景，还可以考虑使用状态管理工具如NgRx或Akita来管理组件间的数据流动。