gpt4 book ai didi

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

转载 作者:行者123 更新时间:2023-11-30 15:18:36 25 4
gpt4 key购买 nike

我正在 Angular 中创建一个表,我的问题是当我循环遍历项目数组时我有一个重复的值(系统代码)。我想知道是否有一种方法可以隐藏已经显示在表中的值,这里是数据结构的外观。

系统代码

out_signal_id

sig_epoch_utc

num_of_signals

状态码

状态说明

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 >

最佳答案

您可以注入(inject) angular-ui 并使用 'unique' 过滤器以过滤掉基于属性的唯一值,

只需将其更新为

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

演示

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

关于javascript - Angular 1.5 在 ng-repeat 上隐藏重复值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44119372/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com