Question

我从角度4和服务器端渲染开始，目前我正在尝试获取一个概念证明来获取我的一个外部API的一些数据。该API返回一个Json对象。

该网站呈现得非常好，但是现在我已经包含了获取数据的调用，它没有呈现，我得到的响应似乎不是我应该得到的。

在app.components.ts中我添加了：

 private apiUrl= 'https://myapi/Users';
  data: any = {};

  constructor(private http: Http){
    this.getUsers();
    this.getData();
  }

  getData(){
    let res=this.http.get(this.apiUrl).map((res: Response)=>res.json());
    console.log("result:",res)
    return res;
  }

  getUsers(){
    this.getData().subscribe(data=>{
      this.data=data;
    })
  }

现在，正如您所看到的，在getData方法中，我在控制台中打印了http调用的结果，但是我得到了这个：

Observable {
  _isScalar: false,
  source: Observable { _isScalar: false, _subscribe: [Function] },
  operator: MapOperator { project: [Function], thisArg: undefined } }

为什么我没有到达json对象？这可能是原因？

Answer 1

由于你的getUsers（）在内部调用getData，你不必在构造函数中再次调用。

constructor(private http: Http){
    this.getUsers();
   //remove this line this.getData();
 }

还将console.log放在subscribe方法中以查看实际数据

getUsers(){
    this.getData().subscribe(data=>{
      this.data=data;
      console.log(this.data);
    })
  }

修改如下面的注释所示，不建议在构造函数中调用方法，使组件实现ngOnit并在里面添加方法

在Angular 4中获取数据

1 个答案: