时间戳

首页 > 解决方案 > 尝试使用量角器过滤 ng-repeat 生成的表

javascript - 尝试使用量角器过滤 ng-repeat 生成的表

问题描述

我有以下表示表格的结构，并试图根据<a href>文本进行过滤，然后是<p>文本：

<tr ng-repeat="a in apples" class="ng-scope">
  <td>
    <p>
      <a href="javascript::" ng-click="openModal()" class="ng-binding">Some text</a>
    </p>
  </td>
  <td>...</td>
  <td>
    <p class="ng-binding">Some other text</p>
  </td>
  <td>...</td>
</tr>

到目前为止，我已经尝试过使用element.all(by.repeater('a in apples')，但从那里我不知道我是否应该使用.filter或应该链接element(by.css())，直到我开始使用<a href>and <p>。如果文本匹配某个值，我想返回 true 并用expect().

我也尝试过查看文档，但大多数示例仅显示如下内容：

element.all(by.css('.items li')).filter(function(elem, index) {
  return elem.getText().then(function(text) {
    return text === 'Third';
  });

标签： javascriptangularjsprotractorautomated-tests

解决方案

您可以通过 找到所有行element.all()，然后获取期望的文本，<a>并<p>在每个tr文本中，如果两个文本都符合期望值，则返回 true。

推荐用于await/async使代码简单。

# Use promise.then(), have to loop all rows, even matched row is not the last row

element.all(by.repeater('a in apples'))
    filter(function(tr){
        let linkText = tr.element(by.css('td:nth-child(1) a')).getText()
        let pText = tr.element(by.css('td:nth-child(3) p')).getText()

        return Promise.all([linkText, pText]).then(function(texts){
            return texts[0] === <link text> && texts[1] === <p text>
        });
    })

# Use await/async, end loop once find match row, not loop all rows

match = false
rows = element.all(by.repeater('a in apples'))
rowCount = await rows.count()

for(let i=0;i<rowCount;i++) {
  let linkText = await rows.get(i).element(by.css('td:nth-child(1) a')).getText()
  let pText = await rows.get(i).element(by.css('td:nth-child(3) p')).getText()
   
  if(linkText === <link text> && pText === <p text>) {
    match = true
    return
  }
}

量角器使用指南await/async

推荐阅读