Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/http/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
未填充Angular2可观察HTTP数据_Http_Angular_Request_Observable - Fatal编程技术网

未填充Angular2可观察HTTP数据

未填充Angular2可观察HTTP数据,http,angular,request,observable,Http,Angular,Request,Observable,我是Angular2的新手,希望从JSON文件加载数据。 我读了AngularIO的文章并做了教程,但我仍然需要一些帮助。 我将“获取数据”拆分为一个加载数据的apiService和一个从apiService获取数据的组件 因为它更简单,所以对于这个问题,我想直接将数据加载到组件,而不使用apiService 这是一个组件: export class StatusComponent implements OnInit { private status = {}; private

我是Angular2的新手,希望从JSON文件加载数据。 我读了AngularIO的文章并做了教程,但我仍然需要一些帮助。 我将“获取数据”拆分为一个加载数据的apiService和一个从apiService获取数据的组件

因为它更简单,所以对于这个问题,我想直接将数据加载到组件,而不使用apiService

这是一个组件:

export class StatusComponent implements OnInit {

    private status = {};
    private error: string;

   constructor(private router: Router, private variables: Variables, private apiService: ApiService, private http: Http) {
        if (!this.variables.getIsLoggedIn()) {
            this.router.navigate(['login']);
        }
    }

    ngOnInit() {
        this.getStatus();
    }

    getStatus() {
       this.http.get('../app/apiFiles/status.json')
      .map((res:Response) => res.json())
      .subscribe(
        data => { this.status = data},
        err => console.error(err),
        () => console.log('done')
      );
      console.log(JSON.stringify(this.status));
    }
}
这是JSON:

{
  "status": {
    "timercount": "0",
    "reccount": "0"
   }
}
在组件中,正确加载了
getStatus()
,并且没有出现错误,但是变量i fill
status
没有填充。 在
getStatus()
之后,变量仍然是
{}
。 此外,
console.log(JSON.stringify(this.status))的输出
{}

我希望有人能帮我解决这个问题!
非常感谢

这是因为
console.log(JSON.stringify(this.status))在http调用完成后执行。请记住,所有http调用都是异步方法。试试这个:

getStatus() {
   this.http.get('../app/apiFiles/status.json')
  .map((res:Response) => res.json())
  .subscribe(
    data => { this.status = data},
    err => console.error(err),
    () => console.log(this.status);
  );
}

您将看到这将打印您的结果,因为
()=>console.log(this.status)在http调用成功完成后执行。

正确的解决方案是:

getStatus() {
       this.http.get('../app/apiFiles/status.json')
      .map((res:Response) => res.json())
      .subscribe(
        data => { this.status = data.status},
        err => console.error(err),
        () => console.log('done')
      );
      console.log(JSON.stringify(this.status));
    }

因此,您必须使用
data.status
,因为JSON文件以“status”开头)

谢谢,但不是,这不是解决方案:/n解决方案是使用
this.status=data.status
,然后加载数据…;)但是非常感谢你!