2013-10-11 7 views
2

у меня есть этот блок спецификации в жасмин:Угловая jqLite: .find() не будет работать - не выбирает теги

define(['common/components/directives/directives', 'angular'], function (directives, ng) { 

describe('The directives module', function() { 

    beforeEach(function() { 
     ng.mock.module('directives'); 
    }); 

    describe('The tabset directive', function() { 
     var scope; 
     var elm; 

     beforeEach(inject(function($rootScope, $compile) { 
      elm = ng.element('<tabset>' + 
          '<tab data-route="/home" data-title="Home"></tab>' + 
          '<tab data-route="/tournaments" data-title="Tournaments"></tab>' + 
          '<tab data-route="/about" data-title="About"></tab>' + 
         '</tabset>'); 

      var scope = $rootScope; 
      $compile(elm)(scope); 
      scope.$digest(); 
     })); 

     it ('should create clickable titles', function() { 
      var titles = elm.find('ul li a'); 

      expect(titles.length).toBe(3); 
      expect(titles.eq(0).text()).toBe('Home'); 
      expect(titles.eq(0).text()).toBe('Tournaments'); 
      expect(titles.eq(0).text()).toBe('About'); 
     }); 

     //it ('should change active tab when clicked', function() { 

     //}); 

    }); 
}); 

});

В тесте it ('should create clickable titles', ... Я стараюсь использовать .find(), но выбор выходит пустым: LOG: Object{}. Это то, что elm содержится в тесте:

LOG: Object{0: 
<ul class="nav nav-tabs ng-scope" ng-transclude=""> 
    <li data-ng-class="{active: active}" data-route="/home" data-title="Home" class="ng-scope"> 
     <a href="#/home" class="ng-binding">Home</a>          
    </li> 
    <li data-ng-class="{active: active}" data-route="/tournaments" data-title="Tournaments" class="ng-scope"> 
     <a href="#/tournaments" class="ng-binding">Tournaments</a>         
    </li> 
    <li data-ng-class="{active: active}" data-route="/about" data-title="About" class="ng-scope">           
     <a href="#/about" class="ng-binding">About</a>          
    </li> 
</ul>, length: 1} 

ответ

2

В el.find() пытается найти элемент в наборе 'детей s, их детей и т.д. Вы' el re пытается найти ul в элементе который является ul себя и содержит только li элементов. Кроме того, вы не можете использовать дочерние селекторы в find. Вместо этого используйте цепочку el.find('li').find('a').

+0

Спасибо, должно было это понять. – ptf

+1

Как сказано в другом ответе, вы также можете выполнить поиск непосредственно для '' a''. – lort

2

Вы не можете использовать .find метод таким образом. Используйте его как:

elm.find('a'); 

Или:

elm.find('ul').find('li').find('a'); 

Посмотрите: http://jsfiddle.net/Khp4R/2/

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

  • Нет связанных вопросов^_^