javascript - 为什么 Angular 事件在设备上会延迟？

Question

在我的手机上，当我单击/触摸某个元素时，会在范围上触发某个进程，并且必须更新它，一切正常，但是如果我想立即重复该事件，则无法使用jqLit​​e/jQuery 中的标准 .on('click') 绑定(bind)器。

当您触摸容器时，两者之间存在一定的延迟。

var myApp = angular.module('myApp', ['ngTouch']);

myApp.controller('myCtrl', function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.counter = 0;
    $scope.fire = function() {
        $scope.counter++;
    }; 
});


myApp.directive('directiveA', function() {
    return {
      restrict: 'A',
      link : function(scope, element) {
        scope.counterB = 0;
        $(element).on('click', function() {
            scope.counterB++;
            scope.$digest();
        });
     }
  };
});

演示:http://jsfiddle.net/HB7LU/21162/

在演示中，如果您触摸红条的一侧，然后触摸另一侧，无论您触摸它的速度有多快，它都会更新。

但是，在绿色条上，如果您触摸左侧，然后触摸右侧，则随着您继续触摸，它不会更新。

红色条使用 ng-click 指令，绿色条使用 Click 绑定(bind)器标准，然后从该作用域链向下运行摘要。

Angulars ngTouch 模块是导致此延迟的原因。我想知道如何使用 ngTouch 覆盖通过 ngClick 产生的延迟？

Answer 1

如果您查看 ng-click 的文档，可以看到tap/release和click事件的触发之间有300ms的延迟，但是ng-click事件并没有使用默认的click来触发handler所以没有延迟，但是当你使用手动的时候click 事件绑定(bind)延迟出现。

A more powerful replacement for the default ngClick designed to be used on touchscreen devices. Most mobile browsers wait about 300ms after a tap-and-release before sending the click event. This version handles them immediately, and then prevents the following click event from propagating.