为什么 observable.subscribe 仅适用于构造函数

Question

在使用 Ionic 3 应用程序时，我遇到了一个问题，即当您observable从 service in订阅ngOnInit并将局部变量更新到其中时，它不会更新视图。

例如 HTML 模板 <p>{{myVariable}}</p>

constructor(myService: MyService) {
}
ngOnInit() {
  this.myService.myObservable.subscribe((data) => {
    this.myVariable = data;
  });
}

但是当你从构造函数做同样的事情时，它就起作用了。

contructor(myService: MyService) {
  this.myService.myObservable.subscribe((data) => {
    this.myVariable = data;
  });
}

它是一个 Ionic 3 应用程序。它包含不同的离子标签。问题是当您订阅时视图不会自动更新ngOnInit。您可以在选项卡之间切换以使其工作。但是当您订阅 constructor 它时，它无需切换标签即可工作。

知道为什么会这样。任何提示将不胜感激。谢谢。

Answer 1

它与 Angular 变化检测有关，有关这方面的更多信息，请阅读：Angular 变化检测。

你应该使用 Angular ngZone 服务来解决这个问题，它会更新视图。

import { Component, NgZone } from "@angular/core";

constructor(
    private ngZone: NgZone
    ...
){ }

...
ngOnInit() {
    this.myService.myObservable.subscribe((data) => {
        this.ngZone.run(()  => {
            this.myVariable = data;
        });
    });
}