2016-11-06 1 views
1

Я работаю над проблемой проблем доступности в моем проекте. Один из сценариев, с которыми я борюсь, у нас есть якорный тег с событием ng-click. Когда кто-то нажимает вкладку и достигает метки привязки на странице с помощью клавиатуры, они нажимают клавишу ввода, и они думают, что она должна что-то сделать. Но, к сожалению, ввод ключевых событий и кликов хорошо работает с кнопочным управлением, но не с привязкой. У кого-нибудь есть предложения по решению этой проблемы?Поднять якорь ng-click при вводе нажатия клавиши для доступа в угловом

благодарит заранее.

ответ

0

Я столкнулся с аналогичной проблемой и решил, что это будет создание простой директивы, которая перехватывает события keydown/keypress по ссылке, а затем вызывает функцию, связанную с директивой.

Вот директива:

// Allows for the interception of the enter key, and then calling a passed in function 
(function() { 
    'use strict'; 
    angular 
     .module('app.directives') 
     .directive('convEnter', convEnter); 

    function convEnter() { 
     var directive = { 
      restrict: 'A', 
      link: link 
     }; 
     return directive; 

     //////////////////////////////////////////////////////////////////////// 

     function link(scope, element, attrs) { 
      element.bind('keydown keypress', function (event) { 
       if (event.which === 13) { 
        scope.$apply(function() { 
         scope.$eval(attrs.convEnter, { 'event': event }); 
        }); 

        event.preventDefault(); 
       } 
      }); 
     } 
    } 
})(); 

Чтобы использовать его, вы бы просто применить его к вашей ссылке, то есть:

<a conv-enter="vm.click()" ng-click="vm.click()">Click Link</a> 

Конечно, это немного повторяющееся, как вы определяете " vm.click() "дважды; вы можете оптимизировать это, если хотите, указав, что директива просто вызывает функцию «щелчок» на самом элементе, если вы всегда хотели, чтобы щелчок и клавиша ввода вызывали ту же функцию. (В моем сценарии мне иногда нужно было различать два, и, следовательно, я разрешал передавать в отдельной функции)

Смежные вопросы