Question

这是一张表：

<tbody ng-repeat="objs in Objects" ng-click="Click()">
    <tr>
        <td><img src="{{objs.img}}">{{objs.name}}</td>
        <td>{{objs.owner}}</td>
        <td>{{objs.timeSt}}</td>
        <td>{{objs.state}}</td>
        <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
        <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
        <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
        <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
    </tr>
    <tr ng-show="param"><td colspan="8">lol</td></tr>
    </tbody>

我需要点击并隐藏可见的其他行来制作可见的行。

Answer 1

非常确定您不想遍历tbody元素，而是遍历tr元素。

对于重复多个元素，AngularJS中有ng-repeat-start和ng-repeat-end指令：

<table>
  <tr ng-repeat-start="a in [1,2,3,4]">
    <td ng-click="param=!param">show second row</td>
  </tr>
  <tr ng-repeat-end ng-if="param">
    <td>ja</td>
  </tr>
</table>

对于您的示例，将导致

<tbody>
<tr ng-repeat-start="objs in Objects" ng-click="param=!param">
    <td><img src="{{objs.img}}">{{objs.name}}</td>
    <td>{{objs.owner}}</td>
    <td>{{objs.timeSt}}</td>
    <td>{{objs.state}}</td>
    <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
    <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
    <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
    <td><progressbar animate="false" value="dynamic" type="success"><b>{{objs.metrics.Test}}%</b></progressbar></td>
</tr>
<tr ng-repeat-end ng-show="param"><td colspan="8">lol</td></tr>
</tbody>

在多个表行和ng-show上进行角度ng重复

1 个答案: