角度过滤器可在应用过滤器之前从输入的单词中去除重音

Question

我正在使用以下过滤器从用户在输入字段上输入的单词中删除重音符号，然后在过滤器上使用结果字符串。

    .filter('removeAcentos', function(){
    return function (source) {
        var accent = [
            /[\300-\306]/g, /[\340-\346]/g, // A, a
            /[\310-\313]/g, /[\350-\353]/g, // E, e
            /[\314-\317]/g, /[\354-\357]/g, // I, i
            /[\322-\330]/g, /[\362-\370]/g, // O, o
            /[\331-\334]/g, /[\371-\374]/g, // U, u
            /[\321]/g, /[\361]/g, // N, n
            /[\307]/g, /[\347]/g, // C, c
        ],
        noaccent = ['A','a','E','e','I','i','O','o','U','u','N','n','C','c'];

        for (var i = 0; i < accent.length; i++){
            source = source.replace(accent[i], noaccent[i]);
        }

        return source;
    };
})

视图中的代码是：

    <input type="text" id="curso" name="curso" ng-model="ctrl.curso" validate>
    <ul>
        <li ng-repeat="curso in ctrl.arrayCursos | removeAcentos: ctrl.curso">
        ...
        </li>
    </ul>

但是，出现错误“源未定义”，并且我不明白为什么。我也不能在控制器内部使用函数作为过滤器，因为我将在更多控制器中使用它。我想找到我的代码中的错误在哪里。

ctrl.curso是在用户进入页面时预定义的，因此我不理解“源未定义”错误，因为ctrl.curso它总是已定义。 ctrl.curso是通过$ http请求获取的（如果相关）。

我以前使用|filter: ctrl.curso过，但是知道我需要将ctrl.curso转换为不带重音符号的字符串，并基于此字符串过滤列表。

为了澄清起见，我正在寻找根据用户输入的单词过滤数组的方法。但是，首先，我想将此单词转换为不带重音符号的字符串，然后再应用过滤器本身。例如，如果用户键入单词“espécie”，我想基于字符串“ especie”进行过滤。

Answer 1

您需要链接过滤器。首先，您需要删除用户输入上的重音符号：

search | removeAcentos

然后，您要根据此新值过滤数组：

filter: (search | removeAcentos)

注意括号以确保按正确的顺序应用过滤器。

更新ng-repeat的结果：

<li ng-repeat="curso in ctrl.arrayCursos | filter: (search | removeAcentos)" />
        {{ curso }}
</li>

链接到工作的JSFiddle