Wie öffne Dropdown in eckigen js?

Question

können wir das Dropdown-Menü öffnen, wenn es mit dem Tab-Schlüsselwort fokussiert wird. Ich möchte das Dropdown-Menü öffnen, während ich die Tab-Navigation verwende.

Beispiel, wenn ich in Eingabefeld am (Fokus auf Eingabefeld) dann, wenn ich Registerkarte drücken Fokus auf Taste geht dann nach unten fallen, hier habe ich das Dropdown- hier öffnen will, ist mein Code http://codepen.io/anon/pen/RGKKrd?editors=1010

angular.module('app',[ ]).directive('abc',function(){ 
    return { 
     restrict: 'EA', 
     link: function (scope, element ,attr) { 
      element.on('keydown', function (evt) { 
       if (evt.which ===9) { 
        // evt.preventDefault(); 
       } 
      }); 
     } 
    } 
}) 

Answer 1

Sie können nicht programmatisch öffnen ein select

here und here Siehe

Wenn Sie dieses Problem zu umgehen suchen here ist etwas, was ich gemacht habe. Navigieren Sie zu select box mit tab key und wählen Sie Ihre option. Die select bleibt so lange offen wie sie in focus ist. Es schließt auf focusout

Hier ist die Richtlinie

angular.module('app',[ ]).directive('abc',function(){ 
    return { 
     restrict: 'EA', 
     link: function (scope, element ,attr) { 

      element.on('keyup', function (evt) { 
       if (evt.which ===9) { 
        var length = element.find("option").length; 
        element.attr("size",length); 
        //element.attr("size",0); 
       } 
      }); 

      element.on('keydown', function (evt) { 
       if (evt.which ===9) { 
        var length = element.find("option").length; 
        element.attr("size",0); 
        //element.attr("size",0); 
       } 
      }); 

     } 
    } 
}) 

nicht die beste Lösung, aber in der Nähe, was Sie suchen.

Answer 2

Sie können es nicht tun, aber es gibt einige Arbeit um Art von Code, mit denen Sie gehen können. Sie können Ihren Js-Code wie folgt ändern.

angular.module('app',[ ]).directive('abc',function(){ 
    return { 
    restrict: 'EA', 
    link: function (scope, element ,attr) { 
     element.on('keydown', function (evt) { 
      if (evt.which ===9) { 
      //debugger; 
      if(document.activeElement.localName==="select"){ 
         angular.element(document.activeElement).attr("size",1); 
      } 
      if(document.activeElement.nextElementSibling!==null && document.activeElement.nextElementSibling.localName==="select"){ 
      angular.element(document.activeElement.nextElementSibling).attr("size",document.activeElement.nextElementSibling.childElementCount); 
      } 

      } 
     }); 

    } 
    } 
}) 

Dies ist keine richtige Lösung, nur eine Abhilfe