0

アイテムのリストがあり、それぞれに指を移動すると、たとえば各アイテムの ID を取得したいと考えています。マウスでは機能しますが、タッチでは機能しません。私はこのライブラリを使用しています: https://github.com/nglar/ngTouch

HTML:

<p class="text-center" > item : {{current}}</p>
<p class="text-center" > state : {{state}}</p>
<div class="row" ng-repeat="item in items" >
    <div ng-style="{background: color}" 
            style="width:100px;height:100px;margin-top:10px;margin-left:auto;margin-right:auto" 
            ng-touchstart="onTouchstart(item)" 
            ng-touchmove="onTouchmove(item)" 
            ng-touchend="onTouchend(item)">
        <p>{{item}}</p>
    </div>
</div>

JS:

$scope.items    = ["1" , "2" , "3"];
$scope.current  = "0";
$scope.state    = "waiting..."
$scope.color    = "red";

$scope.onTouchstart = function(item) {
   $scope.current   = item;
   $scope.state     = "Touch start"
}

$scope.onTouchmove = function(item) {
   $scope.current  = item;
   $scope.state    = "Touch move"
}

$scope.onTouchend   = function(item) {
   $scope.current   = item;
   $scope.state     = "Touch end"
}

現在の要素にいる場合は正常に動作しており、3 つの動きが検出されます。しかし、たとえば、アイテム1に触れて指をアイテム2に移動しても、それは検出されず、アイテム1のままです。

4

1 に答える 1

0

位置などの他の基準に基づいて、タッチオーバーした要素のスコープを取得する必要があります。

e.preventDefault();
var touch = e.originalEvent.changedTouches[0] || e.originalEvent.touches[0] || e.touches[0] || e.changedTouches[0];
var x = touch.pageX;
var y = touch.pageY;
var element = document.elementFromPoint(x, y);
var scope = angular.element(element).scope();
于 2016-06-15T02:37:45.433 に答える