2013-09-25 24 views
6

Tôi đã bắt đầu sử dụng mô-đun bấm phím góc ui và đã tự hỏi liệu có cách nào để tạo các phím tắt toàn cục hoạt động không có vấn đề nơi tôi được đặt trong cơ thể.liên kết khóa toàn cầu góc-ui

Tôi đã thử liên kết khóa ui-keydown của mình với phần thân nhưng vì nó không được lấy nét nên các sự kiện chính không được kích hoạt.

ví dụ:

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

Tôi biết tôi chỉ có thể tập trung một div và đính kèm các tổ hợp phím đó nhưng những gì xảy ra khi tôi có một hình thức và tôi muốn truy cập tất cả các tổ hợp phím toàn cầu trong từng lĩnh vực?

+0

Bạn đã cố gắng ràng buộc sự kiện này với '$ window' trong hàm liên kết' điều khiển' hoặc 'chỉ thị' của bạn? – rogerz

+0

Tôi hiện có và nó phàn nàn về 'đối tượng không có phương pháp' áp dụng '' vì vậy tôi đã thử đặt một hàm áp dụng trong phương thức nav_to của tôi nhưng nó không nhận ra nó. Có cách nào đặc biệt để làm điều đó không? – map7

+0

Bạn có thể đặt một jsfiddle? –

Trả lời

16

Hãy thử điều này trong điều khiển ứng dụng chính của bạn:

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

Làm việc rực rỡ, ngoại trừ tôi phải thay đổi '$ window' thành' window'. –

+0

@BenFortune Bạn nên tiêm dịch vụ [$ window] (https://docs.angularjs.org/api/ng/service/$window) làm phụ thuộc vào bộ điều khiển (hoặc bất cứ nơi nào nó được sử dụng). – user2301179

+0

@ user2301179 Nó đã được sử dụng trong một chỉ thị và được tiêm, mặc dù nó không hoạt động. –

2

Bạn có thể làm một bộ điều khiển và cài đặt nó trên thẻ cơ thể, và thiết lập một cuộc gọi lại sự kiện quan trọng cũng như:

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

Và sau đó set:

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); 
Các vấn đề liên quan