什么是ZoneAwarePromise

Question

我正在使用angular6。ZoneAwarePromise当我尝试将转换为时，其中一个http调用返回Observablea Promise。同样，then块也不会被调用。

const login = this.authService.login(email, password).toPromise()
login.then(() => {\* not getting called*\})

有人可以解释什么是ZoneAwarePromise？

Answer 1

Angular严重依赖zone.js来保持跨异步任务的执行上下文。它包装在称为的可注入服务中NgZone。

这些区域包装了用于运行异步任务的常见JS对象，其中包括Promises。这Zone作为任务，MicroTask等进行维护。

A ZoneAwarePromise在功能上仍然与普通Promise相同，但是在内部始终了解Zone的执行上下文，并且Zone可以知道Promise何时完成。

在Angular中，此执行上下文几乎总是意味着运行更改检测。

Answer 2

我们使用 Angular 是因为我们只能更改模型，它会根据我们通过元数据提供的声明性模板为我们自动更新视图。

Angular 处理这种情况的方式是拦截三种类型的事件：

• 用户事件（如点击），
• 时钟 ( setTimeout, setInterval) 和
• 网络 ( fetch, XHR, HttpClient)。

总的来说，这是通过zone完成的。当您加载时setTimeout，它实际上将默认setTimeout实现与其自己的实现交换，但具有相同的签名。当您调用 时setTimeout，您甚至不知道您正在使用区域。

在一个非常高的层次上，它几乎是这样工作的：

const originalSetTimeout = window.setTimeout
window.setTimeout = (fn, time) => {
  originalSetTimeout(() => { fn(); updateView() }, time)
}

它几乎只是像往常一样执行你的函数，然后调用另一个东西——Angular 使用它来更新视图。

ZoneAwarePromise只是一种使用方式，Promise以便该区域知道它。您可以在 Zone.js 的源代码中找到实现细节，但这就是它的要点。