在我的 Angular 项目中，我目前有一个使用 http 调用从我的 java 代码中检索数据的服务。服务每 10 秒调用一次 Java 端并从中获取新数据。我现在有另一个组件需要我的服务中的数据。我需要这个组件有一个名为“数据”的字段，当服务获取新信息时它会自动更新。
如何设置它们以便服务将新信息推送到我的其他组件？我希望能够在我的组件的 html 中使用 {{data}} 并使其自动更新而无需重新加载页面。
我的组件已经包含“Autowired”服务。所以目前我可以调用 'this.data = this.service.getData()' 但该调用在我的 ngOnInit 方法中，所以它只发生一次，并且当服务的数据字段更新时，数据字段不会更新。
【问题讨论】：
标签： javascript html angular service observable
您可以创建一个为订阅者发布数据的消息服务或在您的原始服务中实现此功能。
我建议有一个单独的消息服务，并让相关组件或服务发布/订阅它。
messaging.service.ts
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
@Injectable()
export class MessagingService {
private sharedValue = new Subject<string>();
// Observable string streams
sharedValue$ = this.sharedValue.asObservable();
// Service message commands
publishData(data: string) {
this.sharedValue.next(data);
}
你会像这样注入服务：
constructor(private messagingService: MessagingService ) {}
发布到服务：
this.messagingService.publishData(sharedValue);
订阅服务：
this.messagingService.sharedValue$.subscribe(
data => {
this.localSharedValue = data;
});
来自下面的答案：DeborahK（每个人都应该观看的 Pluralsight 课程）
实际上，您只需要一个 getter。
将您的“数据”属性更改为 getter，这样就可以解决问题：
get data(): any { return this.service.getData(); }角度变化检测将检测到任何时间数据发生变化 将导致它重新评估其绑定并调用的服务 这个 getter 重新获取数据。
不需要花哨的服务或主题。 :-)
【讨论】：
实际上，您只需要一个 getter。
将您的“数据”属性更改为 getter，这样就可以解决问题：
get data(): any {
return this.service.getData();
}
Angular 更改检测将检测服务中数据发生更改的任何时间，这将导致它重新评估其绑定并调用此 getter 以重新获取数据。
不需要花哨的服务或Subject。 :-)
【讨论】：