web-dev-qa-db-ja.com

「ng-repeat」「一意の」値を取得する方法

配列を使用して、リスト内のunique情報をフィルタリングして表示しようとしています。そのために、angular inbuild filterメソッドを使用します。

しかし、エラーが発生しています。

これが私の試みです(SubProjectNameでフィルタリングしています)

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

ライブデモ

11
3gwebtrain

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 を編集したので、動作します。

20
muenchdo

このような答えを探していると思います

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>

デモ

5
Shamal Perera

おそらく使用しようとしている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']);
3

http://plnkr.co/edit/sx3u1ukH9752oR1Jfx6R?p=preview フィルターの依存関係を追加しました。

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

これがあなたを助けることを願っています

1
Jayant Patil