javascript - ng-click、ng-mouseover 等是否会创建观察者并减慢页面速度?它比 jQuery 事件绑定(bind)更好吗?

标签 javascript angularjs

我想知道在整个应用程序中大量使用 ng-click、ng-mouseover 等指令是否会导致类似于 ng-repeat 的性能问题?

我正在使用 AngularJS 开发一个应用程序。由于 ng-repeat 和它创建的观察者数量,我已经遇到了很多问题。性能受到了影响,我正在努力解决。

最佳答案

在 Angular 的事件指令中没有创建额外的 watch 。

事件指令非常简单,使用 jquery(如果不包含 jquery,则使用 jqLit​​e)将事件监听器添加到带有指令的元素(即 ng-click)。这是以 Angular 设置事件指令的代码。如您所见,他们并没有创建 watch 。

var ngEventDirectives = {};
forEach(
  'click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter mouseleave keydown keyup keypress submit focus blur copy cut paste'.split(' '),
  function(name) {
    var directiveName = directiveNormalize('ng-' + name);
    ngEventDirectives[directiveName] = ['$parse', function($parse) {
      return {
        compile: function($element, attr) {
          var fn = $parse(attr[directiveName]);
          return function(scope, element, attr) {
            element.on(lowercase(name), function(event) {
              scope.$apply(function() {
                fn(scope, {$event:event});
              });
            });
          };
        }
      };
    }];
  }
);

请记住,$scope.apply() 会启动摘要循环,在该循环中处理 Angular 异步队列并迭代监视列表。

关于javascript - ng-click、ng-mouseover 等是否会创建观察者并减慢页面速度?它比 jQuery 事件绑定(bind)更好吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22816940/

相关文章:

angularjs - 了解 angularJS 的逐步手动引导

javascript - 服务返回的值未在 angularjs 中的 Controller 变量中更新

javascript - Angular 范围不具有约束力

javascript - 在新行上显示数组中的每个项目

javascript - (js) 使用 jquery 或类似工具平滑地 move div x 像素?

angularjs - 如何继承ui-router中的解析数据

javascript - 跟踪用户输入并提供单词完成- Angular

javascript onclick 不工作?

javascript - 为什么我们不应该直接在 ReactJS 中修改状态?

javascript - React-redux @connect 不起作用,但 connect() 起作用