Question

我正在使用量角器进行Angular 2应用程序的端到端测试（而且我很擅长CSS）。

我一直试图选择所有没有某个类的（div）子元素的元素。他们可以有div孩子，只有这个孩子没有。

单个元素看起来（或多或少）像这样：

<div class="card"
     (click)="clickEvent.emit(generator.id)">

    <div id="card-title-anchor">

        <div class="card-img-top">
             <img src="{{generator.imageUrls.small}}">
        </div>

        <div *ngIf="!canFulfillAAC()" class="sold-overlay">
            <p>bla</p>
        </div>                  

        <div class="col-3 price-overlay">
            <p class="big-price">
                bla
            </p>    
        </div>
    </div>
</div>

我可以使用.card获取所有“element.all(by.css('.card'))”元素。

但是我如何只获得那些不包含sold-overlay类的子div的那些？

修改的：我删除了css标签。我主要关心如何使用量角器定位器实现这一点 - 无论是通过css选择器，xpath表达式还是其他方式。

Answer 1

您也可以使用filter()方法来实现这一目标，

element.all(by.css(".card")).filter(function(cardElement){
    return cardElement.all(by.css(".sold-overlay")).count().then(function(count){
        return count == 0;
    });
});

Answer 2

抱歉，我不知道如何使用CSS选择器，但可以通过xpath来实现：

element.all(by.xpath('//div[@class="card" and not(.//div[contains(@class, "sold-overlay")])]'))

如果class包含多个值，那么匹配@class=value并不是一个好主意，因为它会匹配整个属性。使用css时，这与div.value不同。

如何选择所有没有特定班级孩子的元素？

2 个答案: