Angular 7 - .json() 的 HttpClient 问题

Question

我试图将我从 json 得到的响应转换成一个数组:

export class PostsService {
  apiRoot: string = "https://public-api.wordpress.com/rest/v1.1/sites/en.blog.wordpress.com/posts/?number=3";
  results: PostsItem[];
  loading: boolean;

  constructor(private http: HttpClient) {
    this.results = [];
    this.loading = false;
  }

  getPosts(term: string): Observable<PostsItem[]> {
    let apiURL = `${this.apiRoot}`;
    return this.http.get(apiURL)
    .map( res => {
      let results = res.json().results.map( item => {
        return new PostsItem(
          item.ID,
          item.post_thumbnail,
          item.date,
          item.title,
          item.url,
          item.author,
          item.avatar
        );
      })
      return results;
    });
  }
}

而且我知道当我使用 HttpClient 而不是 Http 时，不需要使用 .json() 但我在语法上苦苦挣扎。

Answer 1

你应该查看 API 响应的 posts 属性，像这样(使用 arrow functions 简化):

getPosts(): Observable<PostsItem[]> {
return this.http
  .get(this.apiRoot)
  .map(res =>
    res.posts.map(
      item =>
        new PostsItem(
          item.ID,
          item.post_thumbnail,
          item.date,
          item.title,
          item.url,
          item.author,
          item.avatar
        )
    )
  );
}

现在 results 是一个 PostItem 数组

我已经创建了一个工作演示，你可以在这里查看 -> https://codesandbox.io/s/78w2vl0p0