dartlang：你如何突出表行？ [英] dartlang: how do you highlight table rows?

问题描述

我是dart的新手，所以这可能看起来像一个愚蠢的问题，但我想根据列值应用不同的CSS到不同的行：

I'm new to dart so this might seem like a silly question but I'd like to apply different CSS to different rows based on column values:

<table id="requests">
      <tr>
        <td>Title</td>
        <td>Status</td>
        <td>Date</td>
        </tr>
         <tr>
        <td>Foo</td>
        <td>Approved</td>
        <td>Date</td>
        </tr>
         <tr>
        <td>Bar</td>
        <td>Denied</td>
        <td>Date</td>
        </tr>
         <tr>
        <td>Ipsum</td>
        <td>None</td>
        <td>Date</td>
        </tr>
      </table>

到目前为止，我可以这样做：

So far I can do this:

queryAll("tr td").classes.add("foo");

但我想知道如何获取列的值为Approved的所有行。 p>

But I'm wondering how to get all rows whose columns have the value "Approved".

推荐答案

这是一个快速的脏方式来做它从代码：

Here is a quick dirty way to do it from code:

  querySelectorAll('tr').where(
      (tr)=> tr.children.any(
         (td)=>td.text == 'Approved'
       )
  )
  .forEach((approvedTr)=>approvedTr.classes.add('approved'));

但我真的建议你使用 / strong>（例如 Polymer 或 AngularDart ）根据数据设置不同的样式/类。

But i really recommend you to use a databinding framework (like Polymer, or AngularDart) to set different styles/classes depending on data. It's far more easy to use.

[使用Polymer打开一个新线程]

[A new thread was opened about doing this using Polymer]

这篇关于dartlang：你如何突出表行？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！