Question

我正在Angular中创建一个表，我的问题是，当我遍历项目数组时，我有一个重复的值（syscode）。我想知道是否有一种方法来隐藏已经在表中显示的值，这里是数据结构的外观。

syscode

out_signal_id

sig_epoch_utc

num_of_signals

STATUS_CODE

status_note

如果syscode总是会将相同的值包含两次，那么无论如何只能在循环数组时在Angular中显示一次？谢谢

<tr ng-repeat="value in sd.data | orderBy: sd.sort_by.col:sd.sort_by.reverse">
                    <td class="text-center no-wrapping">{{value.syscode}}</td>
                    <td>{{value.out_signal_id}}</td>
                    <td class="text-center no-wrapping">{{value.sig_epoch_utc}}</td>
                    <td class="text-center ">{{value.num_of_signals}}</td>
                    <td class="text-center no-wrapping">{{value.status_code}}</td>
                    <td class="text-center no-wrapping">{{value.status_note}}</td>
        <tr >

Answer 1

AngularUI有一个唯一的过滤器。

例如：

<tr ng-repeat="value in sd.data | orderBy: sd.sort_by.col:sd.sort_by.reverse | unique:'syscode'">

编辑：错误输入AngularJS而不是AngularUI

Answer 2

您可以使用angular注入 angular-ui 并使用 'unique' 过滤器，以便根据属性过滤掉唯一值，

只需将其更新为，

<tr ng-repeat="value in sd.data | orderBy: sd.sort_by.col:sd.sort_by.reverse | unique:'syscode'">

<强>样本

＆＃13;

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
    <p ng-repeat="x in data.response | unique: 'ename'">{{x.ename}}</p>
<script>
//App declaration
var app = angular.module('myApp',['ui.filters']);
//Controller Declaration
app.controller('myCtrl',function($scope){
    $scope.data = {"response": [
        {
            "sid": 1,
            "eid": "AA",
            "ename": "AA11"
          },{
            "sid": 2,
            "eid": "AA",
            "ename": "AA11"
          }
    ],
    "status": "success"
};
});
</script>
</body> 
</html>

＆＃13;

Angular 1.5在ng-repeat上隐藏重复值

2 个答案: