Question

我有一个表，我想在其中只显示与某些变量匹配的行，以及隐藏/显示所有行。

因此，如果要在以后添加其他变量，我将如何实现隐藏/显示所有功能，最好保留＆lt;“a＆gt;标记

<a href="" class="collapsectl" id="collapse-expand"><span class="glyphicon glyphicon-triangle-bottom"></span> Expand all</a>
<a href="" class="collapsectl" id="collapse-hide"><span class="glyphicon glyphicon-triangle-right"></span> Hide all</a>

<table style="width: 50%" class="table table-striped table-bordered table-hover">
    <colgroup>
        <col class="col-xs-1">
        <col class="col-xs-3">
        <col class="col-xs-3">
        <col class="col-xs-1">
    </colgroup>
 <thead>
  <th>ID</th>
  <th> name</th>
  <th> name</th>
  <th>Action</th>
 </thead>
 <tbody>
  <tr class="{{ a.b ? 'danger' : 'success' }}" ng:repeat:start="entity in entities">
   <td>{{a.id}}</td>
   <td>{{a.name}}</td>
   <td>{{a.asd.name}}</td>
   <td>
    <a class="glyphicon glyphicon-pencil" href="#project/{{project.id}}"></a>
    <a class="glyphicon glyphicon-triangle-bottom" href="" class="rowtrigger" data-toggle="collapse" data-target="#detail_{{project.id}}"></div>
   </td>
  </tr>
  <tr ng:repeat:end>
   <td colspan="4" class="collapse-row">
    <div id="detail_{{a.id}}" class="collapse statuslabel">
     <span ng:repeat="version in a.versions" class="label label-{{ version.b ? 'danger' : 'success' }}">
      {{version.version}}
     </span>
    </div>
   </td>
  </tr>
 </tbody>
</table>

Answer 1

你可以在Hide / Show all上放置一个click事件，并在控制器中设置一个布尔属性。然后将该boolean属性绑定到行上的ngHide属性。您可以执行ng-hide="hideAll || <whatever other conditions you want>"

之类的操作

AngulaJS根据几个条件隐藏/显示表格/隐藏全部

1 个答案: