Ng-Click이 휴대 기기에서 작동하지 않습니다. ngTouch로 변경하는 방법

Question

나는 angular.js를 사용하는 웹 사이트를 운영하고 있습니다. ng-click은 노트북/데스크톱에서는 잘 작동하지만 모바일 장치에서는 정상적으로 작동하지 않습니다. 저의 연구 결과, ngTouch를 사용해야한다는 것을 알았습니다. 내 문제는 내가 프로그래머가 아니며 그것을하는 방법을 모른다.

나를 도울 수 있거나 올바른 단계 또는 코드를 제공 할 수있는 사람이 있기를 바랍니다.

<script src="../templates/js/jquery.js"></script> 
<script src="../templates/js/angular.js"></script> 
<script src="../templates/js/angular-ui.js"></script> 
<script src="../templates/js/angular-touch.js"></script> 
<script src="../templates/js/angular-touch.min.js"></script> 
<script> 
    function MessageBoardCtrl($scope, $http, $timeout) { 
     $scope.items = []; 
     $scope.message = ''; 
     $scope.email = ''; 
     $scope.lastTime = 0; 

     $scope.refreshMessages = function() { 
      $http.get('../templates/faucet.php/messages?time=' + $scope.lastTime).success(function(data) { 
       for(id in data) { 
        item = data[id]; 
        $scope.items.unshift(item); 
        if($scope.lastTime<item.time) 
         $scope.lastTime = item.time; 
       } 
      }); 
     } 

     $scope.sendMessage = function() { 
      if(!$scope.message) 
       return; 
      $http.post('../templates/faucet.php/add_message', {message: $scope.message, email: $scope.email}).success(function() { 
       $scope.message = ''; 
      }); 
     } 

     $scope.periodicRefresh = function() { 
      $scope.refreshMessages(); 
      $timeout($scope.periodicRefresh, 5000, true); 
     } 

     $scope.refreshMessages(); 
    } 
    </script> 

누군가가 그 위뿐만 아니라 ngtouch 및 교육을 위해 작동에 따라 나에게 깨끗한 코드를 줄 수 : 여기

<div class="container" ng-controller="MessageBoardCtrl"> 
    <div class="span6">  
    <div class="row-fluid item" ng-repeat="item in items" ui-animate> 
     <div class="span2"><img src="../images/post.png" width="48px" height="48px"/></div> 
      <div class=" well well-small">           
       <p>{{item.message}}</p> 
      </div> 
     </div> 
    </div> 

    <div class="span6"> 
     <div class='well'>     
      <button class="btn btn-primary" ng-click="sendMessage()">Share</button> 

는 자바 스크립트입니다 : 이것은 내 코드입니다. 미리 감사드립니다.

Answer 1

터치 이벤트에 대한 직접적인 지시문을 작성할 수 있습니다. 다음은 터치 이벤트를 처리하는 지시문의 예입니다. 아래 지시문은 터치/롱 터치의 경우에만 이벤트를 시작합니다. scope.isMoved는 사용자가 화면을 누르고 손가락을 움직일 때 발생하는 이벤트를 방지합니다. HTML에서

function directive($timeout) { 

    var dir = { 
     link: link, 
     restrict: 'A', 
     scope: { 
      onTouch: '&' 
     } 
    }; 
    return dir; 

    function link(scope, element) { 
     scope.isMoved = false; 
     $timeout(function() { 
      // user start tap on screen 
      element.bind('touchstart', function() { 
       scope.isMoved = false; 
      }); 

      element.bind('touchend click', function (evt) { 

       if (!scope.isMoved) { 
        scope.onTouch(evt); 
       } 
      }); 
      // 
      element.bind('touchmove', function() { 
       scope.isMoved = true; 
      }); 
     }); 
    } 
} 

:

<a on-touch="someFunction()"> Touch</a>