Angular4-如何实时刷新web服务中的数据？

我正在从web服务获取JSON数据。我目前有一个网页实时显示这些数据，但除非我按F5手动刷新页面，否则不会显示新值。如何侦听新的响应并实时将最近的数据显示在Html上？如果有什么不清楚的地方，请告诉我

多谢各位

组件

 ngOnInit(): void {
IntervalObservable.create(1000)
  .subscribe(() => {
    this.appService.getDataLN().subscribe(resLN => {
      //
      ];
      names.forEach(name => {
        this.findLastValueLN(resLN, name);
      })
    }, error => console.log(error))


    this.appService.getDataLS().subscribe(resLS => {
      let names = [
       //
      ];
      names.forEach(name => {
        this.findLastValueLS(resLS, name);
      })
    }, error => console.log(error)
    )}


  findLastValueLN(resLN, name: String) {
let index = resLN.Object.Table.findIndex(d => 
d.objectName[d.objectName.findIndex(objectName => objectName === name)]);
if (resLN.Object.Table[index].objectName == "status") {
  if (resLN.Object.Table[index].LastValue == "on") {
    let index_A = resLN.Object.Table.findIndex(actual => 

html

<div>{{this.arrLN_[0]</div>
//expected arrLN_[2] to be printed only when status is off.. 
<div>{{this.arrLN_[2]</div> 

{{this.arrLN\u0]
//仅当状态为“关闭”时，才应打印arrLN_u2。。
{{this.arrLN_[2]

这是您要找的东西吗

ngOnInit(){
    IntervalObservable.create(1000)
        .subscribe(() => {
            this.appService.getDataLN().subscribe(res => {
                let names = [//some name fileds that I need to serach from JSON];
                names.forEach(name => {
                    this.findLastValueLN(res, name);
                })
            }, error => console.log(error););
            this.appService.getDataLK().subscribe(res => {
                let names = [//some name fileds that I need to serach from JSON];
                names.forEach(name => {
                    this.findLastValueLN(res, name);
                })
            }, error => console.log(error););
        }
      });
}

这将每秒基本轮询您的后端并更新结果。：）

---

可能还需要查看.takeWhile observable修饰符，以确保代码仅在该组件处于活动状态时运行。

您可以在组件中声明一个变量：

result = Observable<any>;

在html文件中，您可以使用异步管道始终显示新值，而无需在component.ts中订阅，因此您的html文件中将包含以下内容：

{{result | async }}

---

所以我有多个订阅。我是在一开始就初始化它吗？还是我需要为每个订阅都这样做？基本上，你可以把angular中的http promise->subscription模型看作是一个单一的后端调用。它创建ajax请求，执行它，返回并分配数据，然后关闭自己。要刷新数据，你需要创建一个observable，它基本上会告诉组件“重新启动”整个过程。您可以将多个订阅放入该“timer observable”，这基本上意味着它们将同时重新启动。或者您可以创建多个timer，如果是ex。您需要为它们分配不同的频率。（即，每秒钟重新启动一个，但每3秒重新启动另一个）因此我有两个单独的http.get.request从不同的端点提取数据，并在component.ts中有两个订阅。但我仍然没有看到html中的更改。您是指像这样的两个订阅。appService.getDataLN（）.subscribe，还是两个定时订阅（具有IntervalObservable）？两个定时订阅.getDataLN（）.subscribe和.getDataLW（）.subscribe

{{result | async }}