通过使用ng-repeat AngularJS对数组中的项目进行计数

Question

>我有一个这样的JSONfile：

vm.names = [{
  'name': 'A'
}, {
  'name': 'A'
}, {
  'name': 'B'
}, {
  'name': 'C'
}, {
  'name': 'C'
}]

我使用AngularJS过滤器在HTML中重复它：

<ul ng-repeat ="name in vm.names | unique'name'>
<li>{{name.name}}</li>
</ul>

这是问题

一个

乙

C

所以我想要计数项目，我想要这样的显示

一数：2

B 数：1

编号：2

我该怎么做？

Answer 1

只需使用角度滤波器提供的groupBy过滤器，就像这个可运行的小提琴演示一样：

视图

<div ng-controller="MyCtrl">
  <ul ng-repeat="item in names | groupBy: 'name' ">
      <li>{{item[0].name}}: {{ item.length}}</li>
  </ul>
</div>

AngularJS应用程序

var myApp = angular.module('myApp', ['angular.filter']);
myApp.controller('MyCtrl', function($scope) {
  $scope.names = [{
    'name': 'A'
  }, {
    'name': 'A'
  }, {
    'name': 'B'
  }, {
    'name': 'C'
  }, {
    'name': 'C'
  }];
});