多个div标签上的angualrjs指令

Question

我对AngularJ还是很陌生，我创建了一个在ng-repeat列表中上下移动的指令。但是我在同一页面上有2个列表，并且在两个列表中使用相同的指令令人烦恼。每当按键发生时，它都会从两个列表中选择行。

下面是带有自定义指令“ arrowSelector”的2个div标签

<div id="_divlookup" class="row"
     style="background-color:#ffffff; overflow-X:hidden; overflow-y:auto; padding:0px; padding-left:10px;"
     arrow-selector  row-index="selectedRow" max-limit="list.length"
     call-function="selectItem(selectedRow,position)" 
     call-on="keypress">list items here</div>  

<div class="col-sm-12"  style="height:410px; overflow-y:scroll;"
     arrow-selector row-index="selectedRowIndex" max-limit="MainList.length"
     call-function="viewItem(selectedRowIndex,MainList[selectedRowIndex].ID)"
     call-on="keydown">second list items</div>

下面是自定义指令

(function() {
    'use strict';

    angular
        .module('mainApp')
        .directive('arrowSelector', arrowSelector);

    testDirective.$inject = ['$document', 'mainService'];

    function arrowSelector($document, mainService) {
        return {
            restrict: 'A',
            scope: {
                rowIndex: '=',
                maxLimit: '=',
                callOn: '@',
                callfunc: '&callFunction',
            },
            link: function(scope, elem, attrs, ctrl) {

                $document.bind('keydown', function(e) {

                    var scrollTop = elem[0].scrollTop,
                        scrollHeight = elem[0].scrollHeight,
                        offsetHeight = elem[0].offsetHeight,
                        offsetTop = elem[0].offsetTop;

                    if (e.keyCode == 38 || e.keyCode == 37) {
                        if (scope.rowIndex == 0) {
                            return;
                        }
                        if (scope.rowIndex > 0 && scope.rowIndex % 13 == 0) {
                            elem[0].scrollTop -= offsetHeight + 20;
                        }
                        scope.rowIndex--;
                        scope.$apply();
                        e.preventDefault();
                        if (scope.callOn == 'keydown') {
                            scope.callfunc();
                        }


                    }
                    if (e.keyCode == 40 || e.keyCode == 39) {
                        if (scope.rowIndex == scope.maxLimit - 1) {
                            return;
                        }

                        if (scope.rowIndex > 0 && scope.rowIndex % 13 == 0) {
                            elem[0].scrollTop += offsetHeight - 20;
                        }

                        scope.rowIndex++;
                        scope.$apply();
                        e.preventDefault();
                        if (scope.callOn == 'keydown') {
                            scope.callfunc();
                        }


                    }
                    if (e.keyCode == 13) {
                        scope.callfunc();

                    }

                });

            }
        };
    }
})();