Question

我有一个基本的Angular Web应用程序，它从与应用程序位于同一服务器上的JSON文件中读取，并通过JSON文件进行解析，以便在对象上设置某些值，从而在我的应用程序中驱动某些行为（应用css类，等）

我无法在线查找和/或弄清楚如何设置控制器以允许文件更改的方式从JSON文件中读取，并且Angular在更改文件后动态重新加载文件无需重新加载整个页面。 JSON文件在部署应用程序的服务器上是本地文件，我想避免站起来使用Web服务来提供已部署应用程序的同一服务器上已存在的文件。

以下是我现在正在做的事情：

ngOnInit(): void {
    // Make the HTTP request:
    this.http.get('../assets/applicationLogs.json').subscribe(data => {
        // Read the result field from the JSON response.
        this.node_a_status= data.nodes[0].status;
        this.node_b_status= data.nodes[1].status;
        this.node_c_status= data.nodes[2].status;
    }); 
}

这是我的JSON文件的样子：

{
    "nodes":[
        { "node":"Node A", "status":"processing", "errors":null },
        { "node":"Node B", "status":"processing", "errors":null },
        { "node":"Node C", "status":"inactive", "errors":null }
        ]
}

首先，我知道我可能需要将此逻辑移出ngOnInit()，但我对如何实现我用打字稿描述的所需行为感到有点迷失。

Answer 1

您正在对文件使用http请求方法，以便＆＃34;轮询它＆＃34; ...与任何其他http JSON服务相同。这是一个现成的轮询器供您导入：https://www.npmjs.com/package/rx-polling

你可以做的最好的事情就是用它创建一个服务并用ngOnInit方法调用它，并按照你所显示的方式使用响应。

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/dom/ajax';
import 'rxjs/add/operator/map';

import polling from 'rx-polling';

// Example of an Observable which requests some JSON data
const request$ = Observable.ajax({
    url: '../assets/applicationLogs.json',
    crossDomain: true
  }).map(response => response.response || [])
  .map(response => response.slice(0, 10)); // Take only first 10 comments

polling(request$, { interval: 5000 }).subscribe((comments) => {
  console.log(comments);
}, (error) => {
  // The Observable will throw if it's not able to recover after N attempts
  // By default it will attempts 9 times with exponential delay between each other.
  console.error(error);
});

从Angular4应用程序中的非静态JSON文件中读取

1 个答案: