如何在 angularjs 中为特殊字符应用搜索过滤器

Question

我有一个玩家数组，我在其中对他们的名字应用了搜索，但问题是名称包含一些特殊字符，我从谷歌得到了一些代码片段，如下所示：

$scope.modelFilterNormalized = function(){
   if($scope.modelFilter)
       return $scope.modelFilter.replace('É','E').replace(/* ... */);
   else return '';
};
tr ng:repeat="friend in friends | filter:modelFilterNormalized()">

问题现在的问题是，当我已经在 ng-repeat 上应用过滤器时，我如何应用它，这取决于很多事情。

这是我当前的实现：

<input class="form-control" placeholder="Inserisci un giocatore" type="search"  ng-model="query.PlayerName">
<div class="table-tr museo_sans500"
     ng-click="addPlayer(player)"
     ng-class="{'active':activeStats == player.PlayerId}"
     ng-switch-default
     ng-repeat = "player in players | filter: query " my-repeat-directive>

查询取决于不同下拉列表等上的其他过滤选项，因此我如何轻松更改它。

提前致谢

Answer 1

您可以使用多个过滤器，如下所示：

ng-repeat = "player in players | filter: query | filter:normalized "

Answer 2

这就是你想要的吗？ 或者请向JSFIDDLE提供明确的要求。

angular.module('app', [])
    .controller('ctrl', function ($scope) {
     $scope.players = ['Amón', 
                     'Bmón', 
                     'Cmán', 
                     'Daún'];
  
  
   function handleSpecialChars(value) {
        return value
            .replace(/á/g, 'a')            
            .replace(/é/g, 'e')
            .replace(/í/g, 'i')
            .replace(/ó/g, 'o')
            .replace(/ú/g, 'u');
    }
    $scope.normalized = function(item) {               
        if (!$scope.query) return true;       
        var text = handleSpecialChars(item.toLowerCase())
        var search = handleSpecialChars($scope.query.toLowerCase());
        return text.indexOf(search) > -1;
    };
  
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<input placeholder="name" ng-model="newPlayer">
<button ng-click="players.push(newPlayer);newPlayer='';">Add Player</button>  
<input placeholder="search" type="search" ng-model="query">
<div ng-repeat="player in players | filter:normalized ">{{player}}
</div>

祝您乐于助人！