基于所选值的 ng-options 过滤器

Question

我必须编写指令来编辑应用程序的标签。

每种文化（例如：en-US）每个属性最多可以有 4 个标签，这些标签包含在 table 中：

 $scope.suffixes = ["DisplayName", "Description", "Hint", "Help"];


 <div class="clear" ng-repeat="label in labelModel | filter:cultureFilter">
      <select ng-options="suffix as suffix for suffix in suffixes | filter:suffixFilter(suffix, label.suffix)" ng-model="label.suffix" />

 </div>

这是我的控制器功能：

    $scope.cultureFilter = function (label) {
        return (label.culture == $scope.labelState.culture);
    }

    $scope.suffixFilter = function (suffix, selectedValue) {

        //arguments are now : [undefined, "DisplayName"]

        return true; // :-(
    }

到目前为止，我已经能够根据区域性过滤 ng-repeat。

但是对于我的 ng-options，我必须过滤掉已经使用过的字符串。但我还必须保持当前值被选中。我如何告诉我的过滤器不应过滤某些值，因为它是当前选定的值？

编辑

现在，我可以收到所选的值，但我无法再收到后缀

Answer 1

您几乎可以使用过滤器功能，但在您的情况下，我认为您真正需要的是自定义过滤器。它们实际上写起来很简单。

过滤器只是在 .filter() 助手中注册的工厂函数。

你只需要一个能接受你关心的参数的人。

//Outer factory function
function SuffixFilter(){

  //Inner function which is our filter
  return function(items, ignoredItem){
     var filteredItems = [];

     angular.forEach(items, function(item){
        //Your filtering logic may be more complex
        // than this. It's only an example
        if(item == someCriteria || item == ignoredItem){
           filteredItems.push(item);
        }
     });

     return filteredItems;
  }
}

angular.module('myModule')
   .filter('suffixFilter', SuffixFilter);

一旦您注册了后缀过滤器，您只需在标记中使用您关心的参数调用它。 Angular 处理其余部分。

<!-- Pass in the current selection to ignore -->
suffixes | suffixFilter:label.suffix

更新 - 基于以下评论：

函数参数并不是那样工作的。它期望计算出一个可以调用的函数。

技术上你可以return一个函数并使用闭包来完成你想要的。像这样：

<!-- In your markup -->
filter:suffixFilter(label.suffix)

//In your controller
$scope.suffixFilter = function (selectedValue) {

   //this is your actual filter here
   return function(item){

      //You have access to 'selectedValue' via
      // a closure
      return item == someCriteria || item === selectedValue;
   }
}

所以，虽然这当然是可能的，但我认为自定义过滤器在语义上更清晰。

基于所选值的 ng-options 过滤器

ng-options filter based on selected value

angularjs

angularjs-ng-options

angular-filters

更新 - 基于以下评论：