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狀態決定在您的控制器。