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>

预期表格：

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

真实表：

Title1 | 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 end 块上应用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？它仅适用于一次重复：

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

ng-repeat-start with ng-hide

2 个答案: