ng-repeat-以ng-hide开始

Question

只是简单的例子。

我的数组：

$scope.arr = [
    {lab1: 'a1', lab2: 'a2', lab3: 'a3', val1: 'av1', val2: 'av2', val3: 'av3'},
    {lab1: 'b1', lab2: 'b2', lab3: 'b3', val1: 'bv1', val2: 'bv2', val3: 'bv3'},
    {lab1: 'c1', lab2: 'c2', lab3: 'c3', val1: 'cv1', val2: 'cv2', val3: 'cv3'},
    {lab1: 'd1', lab2: 'd2', lab3: 'd3', val1: 'dv1', val2: 'dv2', val3: 'dv3'},
    {lab1: 'e1', lab2: 'e2', lab3: 'e3', val1: 'ev1', val2: 'ev2', val3: 'ev3'},
];

我的html：

<table>
    <thead>
    <tr>
        <th>Title1</th>
        <th ng-repeat-start="item in arr" ng-hide="item.val1 == 'cv1'">{{item.lab1}}</th>
        <th>{{item.lab2}}</th>
        <th ng-repeat-end>{{item.lab3}}</th>
        <th>Title2</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>Val1</td>
        <td ng-repeat-start="item in arr" ng-hide="item.val1 == 'cv1'">{{item.val1}}</td>
        <td>{{item.val2}}</td>
        <td ng-repeat-end>{{item.val3}}</td>
        <td>Val2</td>
    </tr>
    </tbody>
</table>

预期表：

标题1 | a1 | a2 | a3 | b1 | b2 | b3 | d1 | d2 | d3 | e1 | e2 | e3 | 标题2

Val1 | av1 | av2 | av3 | bv1 | bv2 | bv3 | dv1 | dv2 | dv3 | ev1 | ev2 | ev3 | Val2

实表：

标题1 | a1 | a2 | a3 | b1 | b2 | b3 | c2 | c3 | d1 | d2 | d3 | e1 | e2 | e3 | 标题2

Val1 | av1 | av2 | av3 | bv1 | bv2 | bv3 | cv2 | cv3 | dv1 | dv2 | dv3 | ev1 | ev2 | ev3 | Val2

那么如何在所有ng-repeat-start结束块上应用ng-hide或其他指令？ 而且-我无法将其包装并使用ng-repeat，不-我不想使用过滤器...

Answer 1

所以我发现的唯一一件事就是将ng-hide重复添加到所有块中：

<table>
    <thead>
    <tr>
        <th>Title1</th>
        <th ng-repeat-start="item in arr" ng-hide="item.val1 == 'cv1'">{{item.lab1}}</th>
        <th ng-hide="item.val1 == 'cv1'">{{item.lab2}}</th>
        <th ng-repeat-end ng-hide="item.val1 == 'cv1'">{{item.lab3}}</th>
        <th>Title2</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>Val1</td>
        <td ng-repeat-start="item in arr" ng-hide="item.val1 == 'cv1'">{{item.val1}}</td>
        <td ng-hide="item.val1 == 'cv1'">{{item.val2}}</td>
        <td ng-repeat-end ng-hide="item.val1 == 'cv1'">{{item.val3}}</td>
        <td>Val2</td>
    </tr>
    </tbody>
</table>

但这很丑陋，因为它是代码重复，并且只能用于很少的重复块。

请稍等片刻。

Answer 2

为什么必须使用ng-repeat-start？ 它仅适用于一个ng-repeat：

 <div ng-repeat="item in arr" ng-hide="item.val == 0">{{item.lab}}{{item.val}}</div>