Question

在我的角度项目中，我目前有一个使用http调用从我的java代码中检索数据的服务。服务每10秒调用Java端并从中获取新数据。我现在有另一个需要我服务中的数据的组件。我需要这个组件有一个名为＆＃39; data＆＃39;只有在服务获取新信息时才会自动更新。

如何设置它们以便服务将新信息推送到我的其他组件？我希望能够在我的组件的html中使用{{data}}，并且无需重新加载页面即可自动更新。

我的组件确实提供了服务＆＃39; Autowired＆＃39;已经。所以目前我只能打电话给#d; this.data = this.service.getData（）＆＃39;但是该调用在我的ngOnInit方法中，因此它只发生一次，并且当服务的数据字段更新时，数据字段不会更新。

Answer 1

您可以创建一个消息服务，为订阅者发布数据或在原始服务中实现此功能。

我建议使用单独的消息服务，并让相关的组件或服务发布/订阅它。

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的课程）

实际上，你所需要的只是一个吸气剂。

将您的'data'属性更改为getter，这样就可以了：
get data(): any {
    return this.service.getData();
}
角度变化检测将检测数据更改的任何时间   该服务将导致它重新评估其绑定和调用   这个getter重新获取数据。

不需要花哨的服务或主题。： - ）

Answer 2

实际上，你所需要的只是一个吸气剂。

更改您的数据＆＃39;属性到吸气剂，这将成功：

get data(): any {
    return this.service.getData();
}

角度变化检测将检测服务中数据更改的任何时间，这将导致其重新评估其绑定并调用此getter重新获取数据。

不需要花哨的服务或Subject。： - ）

将数据从服务推送到组件的最佳方式是什么？

2 个答案: