AngularJS：NG-重複而不OBJ文件的相似關鍵

我有列表：AngularJS：NG-重複而不OBJ文件的相似關鍵

[{ 
key:test1 
name: name1 
}, 
{ 
key:test1 
name: name2 
}, 
{ 
key:test2 
name: name3 
}]

我用ng-repeat來顯示它：

<tr ng-repeat=item in list> 
    <td>{{item.key}}</td> 
    <td>{{item.name}}</td> 
</tr>

是否有可能在不改變具有相似鍵的值相結合結構？不要在我的情況下，可以顯示兩次測試1

現在：

test1 : name1 

test1 : name2 

test2 : name3 


desired result: 

test1 : name1 

_____ name2 

test2 : name3

來源

2017-09-22 Lola

你可以張貼想要的結果？ – Komal

可能重複的[從JavaScript數組中刪除重複]（https://stackoverflow.com/questions/9229645/remove-duplicates-from-javascript-array） –

您可以使用groupBy過濾器：

angular.module('app', ['angular.filter']).controller('ctrl', function($scope){ 
 
    $scope.list = [{ 
 
    key:'test1', 
 
    name: 'name1' 
 
    }, { 
 
    key:'test1', 
 
    name: 'name2' 
 
    },{ 
 
    key:'test1', 
 
    name: 'name3' 
 
    },{ 
 
    key:'test2', 
 
    name: 'name4' 
 
    }]; 
 
})

table, th, td { 
 
    border: 1px solid black; 
 
    border-collapse: collapse; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.js"></script> 
 

 
<table ng-app='app' ng-controller='ctrl'> 
 
    <tbody> 
 
    <tr ng-repeat-start="(key, value) in list | groupBy: 'key'">  
 
     <td>{{key}}</td> 
 
     <td>{{value[0].name}}</td> 
 
    </tr> 
 
    <tr ng-repeat-end ng-repeat='item in value.splice(1)'> 
 
     <td></td> 
 
     <td>{{item.name}}</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

來源

2017-09-22 10:52:47

不知道如何從該組獲得$ index以獲得當前項目清單？ – Lola

組內索引：'$ index';整個列表中的索引：'list.indexOf（item）' –

ng-repeat="item in list | unique:'key'"

來源

2017-09-22 10:53:13

這裏是你如何能做到在sa中常見的值爲key我將使用angular-filter：

angular.module('app',['angular.filter']).controller('mainCtrl', function($scope){$scope.list = [{ 
 
     key:'test1', 
 
     name: 'name1' 
 
     }, 
 
     { 
 
     key:'test1', 
 
     name: 'name2' 
 
     }, 
 
     { 
 
     key:'test2', 
 
     name: 'name3' 
 
     }] 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.min.js"></script> 
 

 

 
<div ng-app='app' ng-controller='mainCtrl'> 
 
    <div ng-repeat="(key, value) in list | groupBy: 'key'"> 
 
     <span ng-repeat='val in value'>{{val.name}} </span> 
 
    </div>  
 
</div>

來源

2017-09-22 11:06:10

使用ng-repeat更新列表之前。

function rd(o, k, v) { 
    var n = []; 
    var l = {}; 

    for(var i in o) { 
     if (l.hasOwnProperty(o[i][k])){ 
     o[i][v] = l[o[i][k]][v]+ " " + o[i][k] 
     l[o[i][k]] = o[i] 
     } else{ 
     l[o[i][k]] = o[i]; 
     } 
    } 

    for(i in l) { 
     n.push(l[i]); 
    } 
    return n; 
} 

var list = rd(arr, "key", "name");

來源

2017-09-22 11:07:14

你可以試試這個：

var app = angular.module('myApp', ['angular.filter']); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.items = [{ 
 
    "key":"test1", 
 
    "name": "name1" 
 
    }, 
 
    { 
 
    "key":"test1", 
 
    "name": "name2" 
 
    }, 
 
    { 
 
    "key":"test2", 
 
    "name": "name3" 
 
    }]; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<script 
 
src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <div ng-repeat="item in items | groupBy: 'key'"> 
 
    \t <h3>Key : {{item[0].key}}</h3> 
 
     <p>Names : <span ng-repeat='i in item'>{{i.name}} </span></p> 
 
    </div> 
 
</div>

來源

2017-09-22 11:45:01 Raghav

AngularJS：NG-重複而不OBJ文件的相似關鍵

回答

相關問題