4

Я нашел похожие вопросы, но у меня нет той же проблемы, с которой я сталкиваюсь. У меня есть список локализаций, которые пользователь может добавить (для создания собственной локализации нашего пользовательского интерфейса). Они могут иметь несколько языков для одного и того же элемента, поэтому они могут вводить текст и выбирать соответствующий язык из выпадающего списка.AngularJS - Фильтровать выбранные объекты из ng-select внутри ng-repeat

Я только хочу, чтобы они могли выбрать язык один раз (для них нет смысла иметь два одинаковых языка в списке). Вот HTML:

<div class="divider-header"> 
    <h4>{{'contactAttributes.localization.title' | translate}}</h4> 
    <button id="add-label-btn" class="btn pull-right" title="Add a label" 
    ng-click="addLocalization()"> 
    <i class="fa fa-plus center"></i> 
    </button> 
</div> 

<div ng-repeat="item in localizations track by $index"> 
    <div class="input-group localization-group"> 
    <label>{{'value.label' | translate}}</label> 
    <input type="text" ng-model="item.label"> 
    <label>{{'value.language' | translate}}</label> 
    <select 
     required 
     ng-options="locale.value as locale.label for locale in localeNames | filter: alreadySelected" 
     ng-model="item.language"></select> 
    <i id="remove-localization-label" 
     class="fa fa-times remove" 
     ng-click="removeLocalization($index)"></i> 
    </div> 
</div> 

Фильтр "alreadySelected" выглядит следующим образом (в директиве, следовательно, сфера вместо $ объема):

scope.alreadySelected = function(language) { 
    return !scope.localizations.filter(function(selectedValue) { 
    return selectedValue.language === language.value; 
    }).length; 
}; 

scope.localizations содержит уже выбранные элементы. Это почти работает, но оно имеет эффект отфильтрования опции, выбранной из самого окна выбора, так что, когда вы выбираете параметр, он отфильтровывается, а поле выбора отображается как пустое. Мне нужно, чтобы выбранный элемент этого окна выбора отображался и был доступен для выбора, но только в этом конкретном поле выбора (а не других в ng-repeat).

Сообщите мне, если это может использовать разъяснения. Благодаря!

EDIT: Вот plunkr показывая вопрос - https://plnkr.co/edit/ALu00gitPg7GLfdGQ75a

ответ

0

Так я нашел решение с оказали помощь lodash. Изменение нг-опций для этого:

ng-options="locale.value as locale.label for locale in availableLocales($index)" 

Заменить функцию alreadySelected с этим:

scope.availableLocales = function(localizationIndex) { 
     return scope.localeNames.filter(function(locale) { 
      return !_.find(scope.localizations, function(localization, idx) { 
      if (localizationIndex === idx) return false; 
      return localization.language === locale.value; 
      }); 
     }); 
     }; 

Если у кого есть альтернативное решение, не стесняйтесь делиться, в противном случае, спасибо за то, что моя резиновая утка, StackOverflow. : P