Question

我正在学习http。我按照https://angular.io/docs/ts/latest/tutorial/toh-pt6.html的教程进行操作，但我无法从响应中获取数据。我没有错误。我使用JSON typicode json：https://jsonplaceholder.typicode.com/posts

这里我的代码与教程相同，无法在我的代码中找到错误。有人可以帮忙吗？

服务

  private postsUrl = 'https://jsonplaceholder.typicode.com/posts'

  getPosts(): Promise<Post[]> {
    return this.http.get(this.postsUrl)
      .toPromise()
      .then(response => response.json().data as Post[])
      .catch(this.handleError);
  }
  private handleError(error: any): Promise<any> {
    console.error('An error occurred', error); // for demo purposes only
    return Promise.reject(error.message || error);
  }

类

export class Post {
  userId: number;
  id: number;
  title: string;
  body: string;
}

成分</ P>

@Component({
  selector: 'my-app',
  template: `

  <div *ngFor="let post of posts">
    {{post.title}}
  </div>



  `,
})
export class App implements OnInit {

  posts: Post[] = [];

  constructor(private postsService: PostsService) { }

  ngOnInit(): void {
    this.postsService.getPosts() 
      .then(posts => this.posts = posts)
  }

}

我有plunker：https://plnkr.co/edit/eEj7vPwf3KjlLkdjAisE?p=preview

提前感谢您的帮助。

Answer 1

您的回复没有data字段。

从

中删除.data

.then(response => response.json().data

固定弹药：https://plnkr.co/edit/9bjXi4qhMYlcla9B4nFP?p=preview

来自http请求的响应未显示在模板中

1 个答案: