Angularjs指令 - 一类名来选择下一个元素

Question

我有以下HTML：

<div> 
    <input type="text" ng-model="search.q" special-input> 
    <ul class="hidden">...</ul> 
    <ul class="hidden bonus">...</ul> 
</div> 

与以下指令：

myApp.directive('specialInput', ['$timeout', function($timeout) 
{ 
    return { 
    link: function(scope, element) { 
     element.bind('focus', function() { 
     $timeout(function() { 
      // Select ul with class bonus 
      element.parent().find('.bonus').removeClass('hidden'); 
     }); 
     }); 
    } 
    } 
}]); 

我要选择使用jqLit​​e的ul.bonus但不能想办法。我尝试使用.next（“。bonus”），但选择器完全被忽略，并且选择了第一个ul。有没有人有一个想法，为什么我不能这样做？

P.S.我只是依靠没有jQuery的AngularJS内部jqLit​​e。

谢谢！

Answer 1

你不会需要一个指令来实现这一目标：

<div> 
    <input type="text" 
      ng-model="search.q" 
      ng-focus="bonus=true" 
      ng-blur="bonus=false"> 
    <ul class="hidden">...</ul> 
    <ul ng-show="bonus">...</ul> 
</div> 

，如果你的需求是更复杂的把有关bonus状态决定在您的控制器。