2016-09-01 13 views
2

私はいくつかの変数に一致する行だけを表示し、すべての行を隠す/表示するテーブルを持っています。AngulaJSいくつかの条件に応じてtablerowsを非表示/非表示すべて

ので、追加の変数が後で追加すると、どのようにして実装して非表示/ <「>タグ

<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> 

答えて

1

を維持しながら、すべてのfunctionallityを好ましくは示しあなたは、表示/非表示にクリックイベントを入れることができますallとコントローラにブール値のプロパティを設定しておき、そのbooleanプロパティを行のngHide属性にバインドします。ng-hide="hideAll || <whatever other conditions you want>"

関連する問題