带接口的角度http请求：statusText:“未知错误”

Question

我试图调用一个示例API(https://jsonplaceholder.typicode.com/posts)通过使用接口在角度上。

然而，我得到以下错误。错误HttpErrorResponse

下面是我的TS文件的代码

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { HttpClient } from '@angular/common/http';

interface Post {
  title: string;
  body: string;
};

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {


  constructor(public navCtrl: NavController, private http: HttpClient) {

  }

  ionViewDidLoad() {

    this.getData();

  }

  getData() {
    this.http.get<Post>('https://jsonplaceholder.typicode.com/posts').subscribe(res => {
      let postTitle = res.title;
      console.log(postTitle);
    });
  }

}

Answer 1

API返回和PostS的Array。请尝试：

getData() {
  this.http.get<Post[]>('https://jsonplaceholder.typicode.com/posts').subscribe(res => {
    let postTitle = res[0].title;
    console.log(postTitle);
  });
}

嗯

Answer 2

所以我试着用https://stackblitz.com/edit/angular-njzmwr

我发现一个问题，你当前的api是返回数据作为一个数组，所以要么从数组或其他选择过滤器的数据

Answer 3

好的，您的代码有一些问题，因为一个res是数组类型的，如果您想访问objects属性，您必须循环访问它（可能类似于这样：）

let postTitle = [];
this.http.get<Post>('https://jsonplaceholder.typicode.com/posts').subscribe(res => {
  res.forEach(element => {
  postTitle.push(element);
});
  console.log(postTitle);
});

我强烈建议通过服务调用API，不要在组件中调用。