Angular无法从服务器获取数据

Question

我使用的是最新的角度，导入和其他角度的东西都是正常的。 我有这样的代码：

...class definition
ngOnInit(){
 this.http.get("http://localhost:5000/getData").subscribe(data => {
  this.data = data;
});
}

其中localhost:5000/getData返回json中的数据。 角度在http://localhost:4200/ ，它有自己的路由器。 数据正确，但是我无法在subscribe()方法之外使用this.data（仅this.data字段为空没有错误）。 我哪里错了？ 我应该怎么做才能解决它（我解决了具有相同来源策略的问题，因为其他事情都可以正常进行）。 我必须将服务器中的数据显示到我的组件中；

Answer 1

subscription是异步的，以这种方式在初始化组件时无法获取值，该值尚不可用，如果您有一些与数据有关的操作，则可以在subscription内部调用一个函数：

this.http.get("http://localhost:5000/getData").subscribe(data => {
   this.data = data;
   this.doAction(this.data);
});

您可以使用异步管道在视图中显示数据：更改代码并使用.map，这样将返回Observable：

import 'rxjs/add/operator/map';
this.data= this.http.get("http://localhost:5000/getData")
              .map(response => response.json());

在您看来使用异步管道，无需订阅

<div *ngFor="let item of (data | asyn)"> {{item}}</div>

Answer 2

    private display = "downloading";    
    ngOnInit(){
     new Promise((resolve,reject)=>{ 
      this.http.get("http://localhost:5000/getData").subscribe(data => {
       resolve(data);                  
      });    
     }).then(data=>{
      if(data['someKey']!==undefined){  
       this.display = "downloaded";    
       this.data = data;            
      }else{this.display = "noData";}   
     });
   }

这是我的解决方案，在从服务器加载数据时显示不同的视图。 视图取决于display