Question

我有一个用AngularJS编写的cordova移动应用程序。在我的应用程序中添加ng-touch会使某些html行为无法正常工作。这个问题的一个例子是当复选框被包含在用ng-click附加的HTML元素中时，复选框没有标记检查的奇怪行为。这适用于台式机/笔记本电脑，问题出现在移动设备上。

示例：

这在移动设备中无效：

  <div ng-click="alertSomething()">
    <input type="checkbox" ng-model="data" name="data" id="data" />
    <label for="data">This checkbox needs to be pressed a couple of times before it is marked as checked
    in any mobile device.</label>
  </div>

虽然这个工作正常：

  <input type="checkbox" ng-model="anotherData" name="anotherData" id="anotherData" />
  <label for="anotherData">This checkbox responds correctly on mobile</label>

最奇怪的部分是当移除ng-touch模块时，它会按预期正常工作。请帮助我，我一直试图解决这个问题几个小时了。

尝试在移动设备上打开此弹药：http://plnkr.co/edit/6LPeJP9QO6NMSpNuQqtQ?p=preview

Answer 1

我之前遇到过这个问题，我做的是创建另一个模拟click事件的指令，以替换ngTouch ng-click版本的特定问题。

<强> FORKED PLUNKER

指令

.directive('basicClick', function($parse, $rootScope) {
  return {
    compile: function(elem, attr) {
      var fn = $parse(attr.basicClick);
      return function(scope, elem) {
        elem.on('click', function(e) {
          fn(scope, {$event: e});
          scope.$apply();
        });
      };
    }
  };
});

HTML 的

  <div basic-click="alertSomething()">
    <input type="checkbox" ng-model="data" name="data" id="data" />
    <label for="data">This checkbox needs to be pressed a couple of times before it is marked as checked
    in any mobile device.</label>
  </div>

ng-click和ng-touch移动设备

1 个答案: