gpt4 book ai didi

javascript - 混合 Angular 应用程序中的变化检测非常慢

转载 作者:行者123 更新时间:2023-12-04 10:48:49 30 4
gpt4 key购买 nike

我们有一个混合的 AngularJS/Angular 8 应用程序,并且我们不断遇到来自不同版本框架的组件之间的变化检测非常慢的问题。到目前为止,我们只在 Angular 组件中使用 AngularJS 组件时遇到过这个问题。常见的情况是有一个新的 Angular 8 表单,其中包含一些旧的 AngularJS 组件,并且对于一些特定的 AngularJS 组件,组件中所做的更改可能需要大约 2 到 10 秒之间的任何时间才能传播到 Angular 表单和用于运行表单验证。 UI 没有挂起或任何东西,它保持响应,但在不同版本的框架之间的通信似乎存在不同的延迟。相同形式的其他 AngularJS 组件可能会无缝工作。我们还没有找到它的根本原因,但我们找到了一种可靠的解决方法;使用 $timeout(() => $scope.apply());在 AngularJS 组件中,通常在 $onChanges -听众。这会触发 Angular 中的更改检测并消除延迟。

现在我们使用一个在 AngularJS 组件中使用的 Angular 组件来面对它。我们有一个新的 Angular 组件,它基本上包装了 NG Bootstrap datepicker ,并且在日期选择器中选择了一个日期后,在父 AngularJS 表单意识到进行了任何更改之前,会有几秒钟的不同延迟(最多大约 10 秒)。 Angular's upgrade guide提到您可以使用 NgZone.run()使用 downgradeModule() 时手动触发变更检测(我们是),但我们还没有找到让它工作的方法。文档并没有真正详细说明 run()也应该使用。我们也试过 ChangeDetectorRef.detectChanges() ,无济于事。

我尝试传递 AngularJS 父组件的 $scope到 Angular 组件并使用 setTimeout(() => $scope.$apply());在 Angular 组件中发出带有 EventEmitter 的更改事件后,并且确实有效;延迟消失了。但显然这不是我们想要真正使用的东西。

关于如何消除 AngularJS/Angular 8 组件之间的更改检测延迟的任何建议,无论是通过手动触发来自 Angular 组件的更改检测还是其他方式?

最佳答案

最后,除了问题中描述的解决方案之外,我们没有找到任何其他解决方案:传递 AngularJS $scope作为 Angular 组件的输入参数并将事件发射包装在 $scope.$apply() 中, IE。

$scope.$apply(() => valueChange.emit(value));

基于 Angular upgrade guide ,这似乎是使用 downgradeModule() 时让它工作的唯一方法.

关于javascript - 混合 Angular 应用程序中的变化检测非常慢,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59575769/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com