AngularJS：コントローラ内の指令のDOM要素へのアクセス

Question

ベースAngularJS以外のライブラリを使用せずに画像カルーセル指令を作成しています。

simpleCarousel.$inject = []; 

function simpleCarousel() { 
    var directive = { 
     restrict: 'E', 
     templateUrl: 'someurl.html', 
     scope: { 
      // Scope variables 
     }, 
     controller: simpleCarouselController, 
     controllerAs: 'ctrl', 
     bindToController: true 
    }; 
    simpleCarouselController.$inject = []; 
    function simpleCarouselController() { 
     angular.extend(this, { 
      next : //handle next image sliding 
      prev : //handle previous image sliding 
     }); 
     function detectSwipe(el) { 
      var touchsurface = el, 
       swipeDirection, 
       startX, 
       distX, 
       threshold = 150, 
       allowedTime = 2000, 
       elapsedTime, 
       startTime; 

      touchsurface.addEventListener('touchstart', function(e) { 
       var touchObject = e.changedTouches[0]; 
       swipeDirection = 'none'; 
       distX = 0; 
       startX = touchObject.pageX; 
       startTime = new Date().getTime(); 
       e.preventDefault(); 
      }, false); 
      touchsurface.addEventListener('touchmove', function(e) { 
       e.preventDefault(); 
      }, false); 
      touchsurface.addEventListener('touchend', function(e) { 
       var touchObject = e.changedTouches[0]; 
       distX = touchObject.pageX - startX; 
       elapsedTime = new Date().getTime() - startTime; 
       if (distX > 0) { 
        swipeDirection = 'right'; 
        return swipeDirection; 
       } else if (distX < 0) { 
        swipeDirection = 'left'; 
        return swipeDirection; 
       } else { 
        return false; 
       } 
      }, false); 
     } 
    } 
} 

私はタッチイベントのイベントハンドラを作成しました。しかし、どのようにタッチイベントに要素を渡すことができますか？ また、JSを使用してスライドまたはCSSユーザー選択プロパティでのユーザーのクリックを防止する必要がありますか？

Answer 1

通常、コントローラーにイベントハンドラーを添付することはお勧めできません。

また、スワップを検出するためにngTouchをチェックアウトすることもできます。

https://docs.angularjs.org/api/ngTouch