2016-06-10 4 views
-1

다음 코드를 가지고 있는데 필터를 unique 필터와 함께 사용할 수 없습니다.AngularJS 고유 필터가 작동하지 않습니다.

jsfiddle에서도 작동하지 않습니다. 내 HTML에서는 select이 채워지지만 unique 필터가 작동하지 않습니다.

https://jsfiddle.net/krayziekry/sw8dvy3u/

내가 당신 jsfiddle을 포크

<div ng-app="example" ng-controller="exampleCtrl"> 
    <!-- Select Basic --> 
    <div class="form-group span6"> 
    <label class="control-label" for="from">Calatorind de la</label> 
    <div> 
     <select id="from" name="from" class="form-control" ng-model="selected.valp"> 
     <option value="">Selecteaza...</option> 
     <option ng-repeat="rec in myRecs | filter: {vals: selected.vals} | orderBy:'plecare' | unique: 'plecare'" value="{{rec.valp}}">{{rec.plecare}}</option> 
     </select> 
    </div> 
    </div> 
    <!-- Select Basic --> 
    <div class="form-group span6"> 
    <label class="control-label" for="to">catre</label> 
    <div> 
     <select id="to" name="to" class="form-control" ng-model="selected.vals"> 
     <option value="">Selecteaza...</option> 
     <option ng-repeat="rec in myRecs | filter: {valp: selected.valp} | orderBy:'plecare'" value="{{rec.vals}}">{{rec.sosire}}</option> 
     </select> 
    </div> 
    </div> 
</div> 

<script>   
angular.module('example', []).controller('exampleCtrl', function($scope) { 

     $scope.myRecs = [{ 
     valp: 'AHO', 
     plecare: 'Alghero (AHO)', 
     sosire: 'Torino - Caselle (TRN)', 
     vals: 'TRN' 
     }, { 
     valp: 'ATH', 
     plecare: 'Atena (ATH)', 
     sosire: 'Constanta (CMD)', 
     vals: 'CMD' 
     }, { 
     valp: 'ATH', 
     plecare: 'Atena (ATH)', 
     sosire: 'Larnaca (LCA)', 
     vals: 'LCA' 
     }, { 
     valp: 'ATH', 
     plecare: 'Atena (ATH)', 
     sosire: 'Londra - Luton (LTN)', 
     vals: 'LTN' 
     }]; 
    }); 
</script> 
+0

jsFiddle에는 angularjs와 관련된 문제가 있습니다. plunker에서 사용해보십시오. – Ohjay44

+1

작동 방식 : http://jsbin.com/lepuxapoxe/edit?html,js,output - 나에게 잘 어울리는 것 같습니다. – Und3rTow

+0

이제는 그런 식으로 작동하지만 고유 한 기능을 사용하여 Atena가 선택에서 한 번만 보여줍니다. – Krayzie

답변

1

주셔서 감사합니다 here

당신은이 같은 사용자 정의 필터 생성해야합니다 :

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

을 그리고 다음과 같이 사용 :

<option ng-repeat="rec in myRecs | unique: 'valp' | orderBy:'plecare'" value="{{rec.valp}}"> 
+0

고맙습니다. – Krayzie

3

지금까지 고유 필터는 다른 모듈 'ui.filters'에서 호출해야한다는 것을 알고 있습니다.

죄송합니다. 제 영어는 모자가 아닙니다.

관련 문제