将服务器的数据设置为 class 的属性 angular 2

Question

我想将数据从 observable 设置为属性。但需要时间来回应卷土重来。所以属性设置为 undefined。如何设置从服务器到 class 属性

的数据

  ngOnInit() {
    this.comics.getChar().subscribe((responses: Response) => this.data = responses[1].json().data.results);
    this.comicsList = this.data; // gives undefined
    console.log(this.comicsList);
  }

Answer 1

您不了解异步函数的工作原理运行。

这一行：

this.comics.getChar().subscribe((responses: Response) => this.data = responses[1].json().data.results);

不会 "finish" 在进入此行之前：

this.comicsList = this.data; // gives undefined

第一行开始执行，无论第一行是否完成，都立即执行下一行。这就是异步执行的本质，你不知道它什么时候会完成，所以不依赖于它的其他一切都会继续执行。但是，在这种情况下，您的第二行明确取决于响应，因此您需要对其进行设置，使其运行仅在您收到响应后：

this.comics.getChar().subscribe((responses: Response) => {
    this.data = responses[1].json().data.results;
    this.comicsList = this.data;
});

这有点多余，除非你有理由维护这个列表的两个引用，否则我可能会直接在订阅中设置 comicsList。

虽然我什至可能不会那样做，但我会这样做：

this.comicsList$ = this.comics.getChar().map(responses => responses[1].json().data.results);

在我需要这些数据的模板中，我会使用异步管道进行订阅。

<div *ngFor="let comic of comicsList$ | async">{{ comic }}</div>

将服务器的数据设置为 class 的属性 angular 2

set data from server to class's property angular 2

observable

angular-http

angular-promise

angular

将服务器的数据设置为 class 的 属性 angular 2

set data from server to class's property angular 2

observable

angular-http

angular-promise

angular

将服务器的数据设置为 class 的属性 angular 2