search一个元素的后代

用量angular器什么是最好的方法来select子元素？ 假设我们有下面的布局…

<div id='parent_1'> <div class='red'>Red</div> <div class='blue'>Blue</div> </div> <div id='parent_2'> <div class='red'>Red</div> <div class='blue'>Blue</div> </div> 

有了jQuery，我们可以做这样的事情。

 var p1 = $('#parent_1'); var p1_red = $('.red', p1); //or p1.find('.red'); var p1_blue = $('.blue', p1); //or p1.find('.blue'); 

但是使用量angular器是否有意义先获取父元素？ 由于这样做var p1 = element('#parent_1'); 实际上并没有检索/search对象，直到getText()或其他东西被调用。

所以这样做..

情况1

 expect(p1.element('.red')).toBe('red'); expect(p1.element('.blue')).toBe('blue'); 

要么

情景2

 expect(element('#parent_1').element('.red')).toBe('red'); expect(element('#parent_1').element('.blue')).toBe('blue'); 

要么

情景3

 expect(element('#parent_1 > .red')).toBe('red'); expect(element('#parent_1 > .blue')).toBe('blue'); 

一种方法比另一种有什么好处？

这是我在做什么，但我不知道是否有任何优势从父母分离cssSelector：

 function getChild(cssSelector, parentElement){ return parentElement.$(cssSelector); } var parent = $('#parent_1'); var child_red = getChild('.red', parent); var child_blue = getChild('.blue', parent); 

看看量angular器的elementFinder我可以这样做：

 function getChild(cssSelector, parentCss){ return $(parentCss).$(cssSelector); } var child_red = getChild('.red', '#parent_1'); var child_blue = getChild('.blue', '#parent_1'); 

Answer 1

将孩子与孩子的CSSselect器分开的好处只是如果你想使用父母的东西。 否则，在一次调用中稍微快一点，比如expect(element('#parent_1 > .red')).toBe('red'); 因为在这种情况下量angular器不需要两次调用浏览器。

使用第一种方法的另一个原因是，如果您使用的定位器策略不能用CSS表示。 例如：

 var parent = element(by.css('.foo')); var child = parent.element(by.binding('childBinding')); expect(child.getText()).toEqual('whatever');