Question

我已经有了这段代码：

<body ng-keydown="key($event);" ng-controller="appController">

function appController($scope) {

    $scope.key = function($event){
        console.log($event.keyCode);
        if ($event.keyCode == 38)
            alert("up arrow");
        else if ($event.keyCode == 39)
            alert("right arrow");
        else if ($event.keyCode == 40)
            alert("down arrow");
        else if ($event.keyCode == 37)
            alert("left arrow");
    }
}

但我只有一个控制器，当它存在于身体内部时，如果按下箭头键，则需要调用一个函数。

如何将身体中的事件从我的appController连接到较低级别的控制器，在这种情况下称为questionController？

Answer 1

在您的父作用域中使用： -

$rootScope.$broadcast('key ', $event);

在您的孩子中捕获此事件（多个）捕获它： -

$scope.$on('key', function (event, data) {
$event=data;
 console.log($event.keyCode);
        if ($event.keyCode == 38)
            alert("up arrow");
        else if ($event.keyCode == 39)
            alert("right arrow");
        else if ($event.keyCode == 40)
            alert("down arrow");
        else if ($event.keyCode == 37)
            alert("left arrow");

  });

Answer 2

appController中的范围：

$scope.key = function($event){

    $scope.$broadcast('key', $event.keyCode)
}

然后是QuestionController中的范围：

$scope.$on('key', function(e, key) {

    if (key == 38)
        alert("up arrow");
    else if (key == 39)
        alert("right arrow");
    else if (key == 40)
        alert("down arrow");
    else if (key == 37)
        alert("left arrow");
})

Answer 3

如果您在主要父母控制器上维护事件，则在$scope内向子女发送$ broadcast事件。

$scope.key = function($event) {
    $scope.$broadcast('key', $event)
}

$scope.$on = function(event, keyEvent) {
    console.log($event.keyCode);
    if (keyEvent.keyCode == 38)
        alert("up arrow");
    else if (keyEventt.keyCode == 39)
        alert("right arrow");
    else if (keyEvent.keyCode == 40)
        alert("down arrow");
    else if (keyEvent.keyCode == 37)
        alert("left arrow");
}

无需在$broadcast内使用$rootScope，因为所有子范围都会监听此事件。

如何在AngularJS中广播和接收按键事件？

3 个答案: