2013-09-25 3 views
6

각도 -Ui 키 누르기 모듈을 사용하기 시작했으며 본문에 배치 된 위치에 상관없이 작동하는 글로벌 단축키를 만드는 방법이 있는지 궁금합니다.angular-ui 전역 키 바인딩

본인의 ui-keydown을 본문에 연결하려고했으나 초점이 맞지 않아 키 이벤트가 실행되지 않습니다.

예 : 난 그냥 사업부를 집중하고 그에게 키 바인딩을 첨부 할 수 있습니다 알고 있지만 나는 양식을 가지고 있고 각 필드에있는 모든 글로벌 키 바인딩에 액세스하려고 할 때 어떤 일이 발생

<body ui-keydown="{'pageup':'nav_to($event, \'users\')'}"> 

?

angular.element($window).on('keydown', function(e) { 
     console.log(e); 
    }); 
+0

'컨트롤러'또는 '지시문'링크 기능에서 이벤트를'$ window'에 바인드하려고 했습니까? – rogerz

+0

지금은 '객체에 메소드가 없습니다'라는 불만이 있습니다. 따라서 nav_to 메소드에 apply 함수를 넣으려고했지만 인식하지 못했습니다. 그것을 할 수있는 특별한 방법이 있습니까? – map7

+0

jsfiddle을 올려 주시겠습니까? –

답변

16

주요 응용 프로그램 컨트롤러이 시도 후

<body ng-controller="keycontroller" ui-keyup="{'enter':'callback($event)'}" > 
    <input type="text" ng-model="test1" /> 
    <input type="text" ng-model="test2" /> 
</body> 

과 설정 :

function keycontroller($scope) { 
    $scope.test1= "It should work here..."; 
    $scope.test2= "...and also here."; 

    $scope.callback = function fn($event) { 
    console.log("Enter key pressed"); 
}; 

} 

var app = angular.module("app", ['ui.keypress']); 
app.controller("keycontroller", keycontroller); 
+1

'$ window'를'window'로 변경해야한다는 것을 제외하고는 훌륭하게 작동했습니다. –

+0

@BenFortune [$ window] (https://docs.angularjs.org/api/ng/service/$window) 서비스는 컨트롤러 (또는 사용되는 곳마다)에 의존적으로 삽입해야합니다. – user2301179

+0

@ user2301179 그것은 작동하지 않았지만 지시문에 사용되어 주입되었습니다. –

2

당신은 컨트롤러를 만들 수 있으며, body 태그에 설정하고,뿐만 아니라 키 이벤트 콜백을 설정합니다 :