'ng-repeat' 如何获取 `unique` 值答案

【问题标题】：'ng-repeat' How to get the `unique` values'ng-repeat' 如何获取 `unique` 值
【发布时间】：2015-09-29 11:41:57
【问题描述】：

使用数组，我试图过滤并显示列表中的unique 信息。为此，我使用 angular inbuild filter 方法。

但我遇到了错误。

这是我的尝试（我正在通过SubProjectName 过滤）

<ul>
    <li ng-repeat="project in projectNames | unique: 'SubProjectName' ">
        {project.SubProjectName}}
    </li>
</ul>

Live Demo

【问题讨论】：

Angular 的内置过滤器没有unique 方法。
是这样的..那么完成它的方法是什么？有人建议我吗？
stackoverflow.com/questions/15914658/…

标签： angularjs ng-repeat angular-filters

【解决方案1】：

AngularJS 默认不包含unique 过滤器。您可以使用来自angular-filter 的那个。只需包含 JavaScript

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

并在您的应用中包含依赖项：

var app = angular.module('myApp', ['angular.filter']);

您的代码应该可以立即运行！我编辑了你的Plunker，所以它可以工作了。

【讨论】：

【解决方案2】：

我想你正在寻找这样的答案

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.projectNames=projects
  $scope.Id = "1";
  $scope.SubProjectName="Retail Building";

})
.filter('unique', function() {
  return function(projects, subProjectName) {
    var newprojects =[];
    projects.forEach(function(project){
      if(project.SubProjectName === subProjectName)
        newprojects.push(project);
    });
    return newprojects;
  };
});

<li ng-repeat="project in projectNames | unique:SubProjectName">{{project.SubProjectName}}</li>

Demo

【讨论】：

这样做很好，而不是添加另一个包来执行相同的功能

【解决方案3】：

您可能尝试使用的 unique 过滤器来自 AngularUI，因此您需要包含它：

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js"></script>

并将其添加为模块依赖项：

var app = angular.module('plunker', ['ui.filters']);

【讨论】：

【解决方案4】：

我已将您的 plunkr 更新为 http://plnkr.co/edit/sx3u1ukH9752oR1Jfx6R?p=preview 添加过滤器依赖

var app = angular.module('plunker', ['angular.filter']);

希望对你有帮助

【讨论】：