AngularJS фильтр уникальный, удаляющий дубликаты в ng-options

Question

AngularJS фильтр уникальный, удаляющий дубликаты в ng-options

0

У меня есть массив:

$scope.arr1 = [option1, option2, option3, option1, option3]

Я использую его для заполнения опций:

<select class="form-control" ng-model="arr1"
     ng-options="option for option in arr1">
     <option value="" disabled>Please select an option</option>
</select>

параметры заполнены, но я хочу удалить из них дубликаты. я пытался:

ng-options="option for option in arr1 | unique: 'option'"

но это дает пустые результаты

Tikaa 30 окт. 2015, в 21:25

Источник

Теги:

javascript

html

angularjs

filter

ng-options

2 ответа

0

unique не включен в AngularJS - этот фильтр в комплекте со старыми версиями на AngularUI, а также, как представляется, обычно доступен в a8m/угловом фильтре. Вы можете модифицировать его в своем приложении, сворачивать самостоятельно или включать модуль предоставления. Обратите внимание на следующее...

ng-options="option for option in arr1 | unique"

// -- AngularUI implementation
.filter('unique', function () {

  return function (items, filterOn) {

    if (filterOn === false) {
      return items;
    }

    if ((filterOn || angular.isUndefined(filterOn)) && angular.isArray(items)) {
      var hashCheck = {}, newItems = [];

      var extractValueToCompare = function (item) {
        if (angular.isObject(item) && angular.isString(filterOn)) {
          return item[filterOn];
        } else {
          return item;
        }
      };

      angular.forEach(items, function (item) {
        var valueToCheck, isDuplicate = false;

        for (var i = 0; i < newItems.length; i++) {
          if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
            isDuplicate = true;
            break;
          }
        }
        if (!isDuplicate) {
          newItems.push(item);
        }

      });
      items = newItems;
    }
    return items;
  };
});

JSFiddle Link - рабочая демонстрация

scniro 30 окт. 2015, в 19:15

Ещё вопросы

Amit · Accepted Answer · 2015-10-30T17-44-00.000Z

Угловой не обеспечивает какой-либо из фильтра коробки, чтобы достичь того, что вам нужно.

Вы пытались использовать ng-options="option for option in arr1 | unique: 'option'", но в угловом виде нет фильтра, называемого unique.

Вы можете посмотреть на доступные фильтры в угловой здесь.

Чтобы получить желаемый результат, вы захотите создать свой собственный фильтр для этого. Я создал фрагмент ниже, который будет фильтровать общие значения. Это должно сработать для вас.

var app = angular.module("myapp", []);
app.controller("testCntrl", function($scope){
  $scope.arr1 = ['option1','option2','option3','option1','option3'];
  
})
.filter("removeDups", function(){
  return function(data) {
    if(angular.isArray(data)) {
      var result = [];
      var key = {};
      for(var i=0; i<data.length; i++) {
        var val = data[i];
        if(angular.isUndefined(key[val])) {
          key[val] = val;
          result.push(val);
        }
      }
      if(result.length > 0) {
        return result;
      }
    }
    return data;
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myapp">
  <div ng-controller="testCntrl">
<select class="form-control" ng-model="arr"
     ng-options="option for option in arr1 | removeDups">
     <option value="" disabled>Please select an option</option>
</select>
    </div>
  </div>