角事件（ng-keydown）内存泄漏答案

【问题标题】：Angular event (ng-keydown) memory leaking角事件（ng-keydown）内存泄漏
【发布时间】：2014-05-03 11:26:36
【问题描述】：

我正在创建一个输入，如果您按住“向上”或“向下”键，它会增加或减少该输入中的数值。

对于关键事件，我使用 ng-keydown 指令更新绑定（ng-bind）到输入本身的 $scope.value。

问题是我握的时间越长，握键就越慢。

I've recreated a basic version in jsfiddle

var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
    $scope.number = 9;
    $scope.updown = function($event) {
        if ($event.keyCode == 40) $scope.number -= 1;
        else if ($event.keyCode == 38) $scope.number += 1;
}   }

它并没有像我自己的实现那样慢，它也有一些其他的东西，但我已经在 chrome 开发工具中将它的 (jsfiddle) 内存泄漏揭示相同的模式。

不仅是 ng-keydown，其他事件也有类似行为 (mousewheel)

发生了什么，我该如何避免这种情况？

编辑为了比较，this is how chrome natively handles the <input type='number'>!

【问题讨论】：

这很有趣，但对我来说，记忆会在一段时间后恢复正常。看起来垃圾收集被延迟了一段时间，直到它到达某个点并被触发。您能否修改您的示例以显示它会如何滞后性能？
如果你在输入之间强制垃圾回收几次，每次都会下降到相同的水平吗？
我没有看到与您的显示相同的内存使用模式，而且我持有它的时间越长响应速度越慢。我看到了与 Matthew Foscarini 相同的模式。
@MathewFoscarini 我已经添加了 chrome 原生处理类似事情的方式。
每次 Angular 处理一个事件。它必须为当前作用域执行摘要循环，并向上传播作用域堆栈。重复此操作，直到没有观察者指示任何更多更改。我假设这会导致创建大量 JS 对象。当摘要存在时，浏览器触发下一个事件，并重复此过程。你不能在 javascript 中强制 GC。所以我不知道你是否能做很多事情。我已经读过，如果您将 jQuery 事件与 Angular 一起使用，那么事件绑定可能会导致 DOM 元素持续存在，应该将其删除，但这不是这里的问题。

标签： javascript angularjs performance memory-leaks dom-events

【解决方案1】：

帮助我解决此问题的解决方法是在输入字段中添加去抖动功能。它以间隔生成 Angular 过程数据，从而产生更流畅的用户体验。

<input type="number" ng-model="number" ng-model-options="{ debounce:500 }">

您可以在这里阅读更多内容：https://docs.angularjs.org/api/ng/directive/ngModelOptions

【讨论】：