问题标签 [ngzone]

angular2+没有延迟的多个setTimeout的执行顺序是什么？

示例：

问题：

(1)1总是保证之前打印2？
(2) 如果是这样，规范的哪一部分是这样说的？
(3) 这在 Angular2+ 代码中被调用。是 angular overridesetTimeout的默认行为吗？

它与其他问题有何不同：

这个问题（1）毫不拖延地询问案例，（2）在角度上下文中询问它（如果角度覆盖setTimeout）。

非问题：

我知道console.log 可能（或可能不是）异步或其他；这个问题与此无关。你可以假设console.log是同步的。

我正在使用这个Tiny Date Picker库来实现一个范围日期选择器，我正在使用NgZone来在角度之外运行它，使用runOutsideAngular()方法，现在我想实现一个模糊事件处理程序，这样当我点击外部日历选择器关闭，但是当 div 模糊时，角度没有触发函数，因为它没有检测到任何变化，因为它在角度之外运行，对此有什么想法吗？

我的 html

我的ts。

我最近将我公司的网站从 React 移到了 Angular，因为我们的大多数项目已经在 Angular 7 上。作为“使用最新和最优秀”的人，我决定实现服务器端渲染以获得接近 100/100（目前为 42/100）的 google 页面速度评级。我在本周的大部分时间里一直在修补它，但没有成功——最近的障碍对我来说尤其难以克服。这是有关我的设置的简要信息，然后我将详细介绍：

• 节点JS 8.9.1
• Angular 7 最新版本
• Webpack 4.26.0
• @ngtools/webpack 7.0.5
• 不使用 angular-cli
• AOT 设置
• 单页应用

这是我在尝试渲染为 SSR 设置的 layout.html 文件时遇到的错误：

经过大量阅读 main.js 捆绑文件后，我将问题归结为以下几点：

在此方法中，_zone 参数为 {}，因此其中没有 onMicrotaskEmpty 方法 => 当尝试 this._zone.onMicrotaskEmpty.subscribe() 时，我们得到“Cannot read property 'subscribe' of undefined”。我继续挖掘堆栈跟踪 - 这是上一步，调用 new ApplicationRef 并将 _zone 作为 {} 传递：

这是我们对错误原因的一些了解 - 在开关的“默认”块中。如果我们在 for 循环之后 console.log(deps[0], depValues[0])，也就是 _zone，我们会得到有趣的东西：

所以，这就是罪魁祸首，我想！'resolveNgModuleDep' 搞砸了！所以我继续挖掘：

就在那里！就在最后之前，在返回 data._parent.get(depDef.token, notFoundValue) 的那一行 - 这是传递 depDef.token（在我们的例子中是 NgZone）的地方，notFoundValue 为空。返回的对象只是 {}，因此后面的所有麻烦。据我所知，我一直在来回尝试从这里解决它，但无济于事。相信我，我已经在 stackoverflow 和谷歌中搜索了一遍又一遍；我已经阅读了 1000 篇中等帖子 - 没有成功。我不使用 angular-cli 因为我喜欢自定义我的 webpack 配置等等，但我怀疑这就是原因，因为 angular-cli 本身在后台使用 webpack。我将在下面的几个片段中粘贴一些额外的东西——我的 webpack 配置，

您会看到我已将服务器端应用程序精简为最基本的，因此我可以消除由我编写的内容引起的错误。任何帮助将非常感激。

我遇到了这样的代码。问题是在选择已经在缓存中的项目后进度条没有消失（当缓存内的 api 调用正常工作时）。我能够想出的是在点击执行操作后没有运行更改检测。有人可以向我解释为什么吗？

缓存正在存储项目 private _data: Map<string, BehaviorSubject<ItemDto>>;并过滤掉初始的空发射

也在变化

至

无需手动触发更改检测即可使其工作，为什么？

缓存：

编辑：

所以我想：tap 正在作为异步操作运行，这就是为什么在组件上已经运行更改检测之后执行它的原因。像这样的东西：

1. this.isProgressBar = true;
2. 变更检测运行
3. 点击（this.isProgressBar = false;）

但我正在摆弄它并做了这样的事情：

现在我不知道为什么在 tap() 中进行操作后更改检测没有在组件上运行，它与区域有关吗？

物品服务：

我正在使用 Angular 7 尝试创建拖放文件上传组件。我让它在下面工作。

我的问题是这方面的性能很糟糕（drop 和 saveFiles() 运行之间的延迟时间约为 4 秒），因为每次触发的事件dragover都在运行更改检测。dragleave经过大量研究后，我发现最好的解决方案应该是dragover从 ngzone 中删除事件，这将阻止更改检测触发。从这里开始：https ://github.com/angular/angular/pull/21681 这样做的一个非常简单的方法似乎是(dragover.nozone)="stopAndPrevent($event)". 这确实解决了性能问题，但它也不再起作用，因为浏览器恢复为使用其默认行为（在浏览器中加载文件）忽略event.preventDefault();. 有谁知道更好的方法或知道如何解决我在这里遇到的性能问题？

我有一个父组件 A 和子组件 b 和服务 c 用于加载加载弹出服务的成功和失败。

在 B 子组件中有一个称为 newchanges 的按钮，b 组件发出值并在组件中调用函数，并且在服务调用中有一个服务调用。

在不断单击子组件 b newchanges 按钮时，我正在递归调用 error.application.tick 。

如果我不使用 application.tick ，则加载对话框未关闭，因此我已在服务中的应用程序引用中使用。它是所有模块的全球服务。

任何人都可以帮助解决：

这是服务调用成功和关闭加载器失败时使用的加载器服务。

我需要关闭加载程序，该加载程序是在另一个服务成功和失败中使用的服务，当我不使用应用程序引用时，它没有关闭，所以我在此之后使用了这个，我点击不断调用服务得到一个提到的错误。

我尝试了另一个使用 zone 的选项，加载程序未关闭：

ChangeDetectorRef.detectChanges从NgZone.runOutsideAngular上下文中调用可以吗？我有通过WebSocket. Websocket 数据流非常密集，因此我将其包装成NgZone.runOutsideAngular. 各种服务订阅 websocket 数据，对其进行处理并报告它们自己的事件 ( Observables)。它们在角度区域外触发。Angular 组件订阅它们并在事件处理程序（观察者）中调用ChangeDetectorRef.detectChanges. 在大多数情况下，这可以正常工作。但在某些情况下，它会导致麻烦：ngFor 可能会在角度区域之外创建新元素/组件。此类组件的事件处理程序将触发超大角度。我知道我可以将它们包装到NgZone.run调用中，但这会导致我想要避免的全局变化检测。

UPDATE1：我创建示例来演示该问题： https ://stackblitz.com/edit/angular-5-change-detection-in-runoutsideangular-context 添加一些项目，然后尝试使用x按钮将其删除。

对于以下代码，UI 似乎没有使用该值更新，但是，我可以看到该值被正确设置为该字段。

我尝试了 2 种不同的方法，bar 没有尝试过更改检测方法，因为我相信下面代码中的方法应该可以工作。

在我的服务中，我监听路由结束事件，原因是，服务中的某些内容需要根据我的路由中是否存在参数进行更改，例如：'/page/:id'。

在一种情况下，URL可能是/page，在另一种情况下，/page/12，所以基于这个事实，我需要从两个不同的服务返回值，如果ID不存在，使用SERVICE1，否则使用SERVICE2 .

我基本上有一个订阅，它返回另一个订阅的值。为此，我依靠订阅从内部订阅发出值，这很有效（请参阅下面的示例）。我的痛苦是，UI 不呈现值。

主要服务

注意：为简洁起见省略了完整的类，只是为了显示有问题的方法：

请注意，此代码已被修改以表示代码，而不是“实际”场景，如果感觉不对，则用于演示代码。

此方法的实现，在一个名为 WatchBlock.ts 的组件中，显示了我通过 ngZone 尝试的可能修复之一：

以下代码块“有效”，因为它返回我正在寻找的值，但是，如前所述，它不会出现在呈现的 HTML 中。

HTML 文件：

数据返回

我也尝试过 BehaviorSubject 方法，但这对我也不起作用。

我没有尝试更改检测器路线，因为如果我了解分区的工作原理，我觉得 ngZone 应该自己进行更改检测。

我无法弄清楚这一点，并希望从那里的大师那里得到任何帮助。

在包装有角度应用程序的科尔多瓦应用程序中，单击后退按钮后，该应用程序似乎不再处于“角度区域”中，所以如果我之后单击任何路由器链接它什么也不做并抛出错误Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()？

已尝试将“pathMatch：'full'”添加到路线。还在这里尝试了解决方案：Angular 7 routerLink 指令警告'导航在 Angular 区域外触发'并且它可以工作，但我不想this.ngZone.run(() => this.router.navigateByUrl(''))在每一页上都写。我觉得 routerLink="" 语法更干净。

我单击的按钮如下所示：

它中断的代码如下（注意所有布尔值都是真的）

如果我只是在 Angular 中运行它，这很好用。但是当我运行包装它的cordova应用程序时，它失败了。由于此错误仅在 DevMode 中发生，这甚至是我需要担心的事情吗？

提前致谢。

我已使用以下代码进行超时。当我登录并保持非活动状态 1 小时时，超时工作成功并且用户正在注销。

但是当我登录并关闭浏览器并在 1 小时后返回并在浏览器中打开应用程序时，会话仍然存在并且用户仍然登录。

为什么我只能注销如果应用程序已打开且处于非活动状态，如果我关闭浏览器并在 1 小时后返回，为什么它不会被注销