angularjs过滤器按名称和日期自定义

时间:2016-12-27 09:31:00

标签: angularjs

我是angularjs的新人,所以我需要你的帮助:)

我有json这样的数据

data = [{"start_date": "sampledate1", "end_date":"sampledate1", "employee":{"id":1, "name":"Name1"}
},{"start_date": "sampledate2", "end_date":"sampledate2", "employee":{"id":1, "name":"Name1"}
},{"start_date": "sampledate1", "end_date":"sampledate1", "employee":{"id":1, "name":"Name2"}
},{"start_date": "sampledate2", "end_date":"sampledate2", "employee":{"id":1, "name":"Name2"}
}]

我需要像这样看到这个

name1
start_date - end_date
name2
start_date - end_date

我尝试groupby名称,但我的date无效?

1 个答案:

答案 0 :(得分:0)

你正在使用棱角分明。因此,请将数据保存在$scope

$scope.data = [{"start_date": "sampledate1", "end_date":"sampledate1", "employee":{"id":1, "name":"Name1"}
},{"start_date": "sampledate2", "end_date":"sampledate2", "employee":{"id":1, "name":"Name1"}
},{"start_date": "sampledate1", "end_date":"sampledate1", "employee":{"id":1, "name":"Name2"}
},{"start_date": "sampledate2", "end_date":"sampledate2", "employee":{"id":1, "name":"Name2"}
}]

在视图中:

<div ng-repeat='item in data | unique'>
  {{item.employee.name}}<br>
  {{item.start_date}}
  {{item.end_date}}
</div>

我写了一个自定义过滤器。

.filter('unique', function() {
   return function(collection) {
      var output = [], 
          keys = [];
      angular.forEach(collection, function(item) {
          var key = item.employee.name;
          if(keys.indexOf(key) === -1) {
              keys.push(key); 
              output.push(item);
          }
      });
      return output;
   };
});

使用ng-repeat

| unique中使用该过滤器

一切顺利。