2013-05-27 3 views
1

다음 코드는 AnguarUI의 Event 지시문을 사용하여 HammerJS 이벤트를 전달한다고 가정하지만 작동하지 않습니다. 나는 분명히 뭔가를 놓치고 있지만 정확히 무엇을 이해하지 못한다. 오류가 발생하지 않습니다.AngularJS + HammerJS + AngularUi : 이벤트 패스 스루 사용

<!doctype html> 
<html ng-app="myapp" charset="UTF-8"> 
    <head> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script> 
     <script type="text/javascript" src="https://raw.github.com/angular-ui/ui-utils/master/modules/event/event.js"></script> 
     <script type="text/javascript" src="https://raw.github.com/EightMedia/hammer.js/v1.0.5/dist/hammer.min.js"></script> 
     <style type="text/css"> 
      div { 
       width: 100%; 
       height: 100%; 
      } 
     </style> 
    </head> 
    <body ng-controller="pageCtrl"> 
     <div ui-event="{ tap: 'tapCallback()' }"></div> 
     <script type="text/javascript"> 
      angular.module('myapp', ['ui.event']); 
      function pageCtrl($scope) { 
       $scope.tapCallback = function() { 
        alert("test"); 
       } 
      } 
     </script> 
    </body> 
</html> 

답변

4

ui-events는 청취자를 첨부하기 위해 elm.bind을 사용합니다.

Hammer.js는 종속성이 없으며 기본적으로 자체를 jQuery에 추가하지 않습니다.
Hammer.js와 jQuery를 통합하기 위해 jQuery 플러그인을 포함 할 수 있습니다.

게시 한 코드에 해당 플러그인이 없습니다. (here's a link to Hammer.js + jQuery Plugin)

그러나 다시 말하지만, 페이지에 jQuery조차 없으며, 그 플러그인이 angular의 jqLite와 함께 작동하는지 잘 모르겠습니다.

당신은 Angular Hammer을 사용하여 모든 문제를 방지 할 수 있습니다
Even the Hammer.js wiki links to it

+0

'UI-event'이 (jQuery를 필요로하지 않는다 (것은 당신이를 사용해야하는)도 않는 UI-utils에 어떤 이상. 그러나, 당신은 여전히 ​​jquery-events를 방출 할 필요가 있습니다. 그래서 이것은 여전히 ​​유효한 대답입니다. – ProLoser