角度过滤器可在应用过滤器之前从输入的单词中去除重音 [英] Angular filter to remove accents from the word inputed before applying the filter

问题描述

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

I'm using the following filter to remove accents from the word inputed by the user on an input field, and then use the resulting string on the filter.

    .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>

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

However, I get the error "source is undefined" and I don't understand why. I also can't use a function inside my controller to be the filter since I'm going to use it in more controllers. I'd like to find where's the error on my code.

ctrl.curso是预定义的，所以我不理解源未定义"错误，因为始终定义了ctrl.curso. ctrl.curso是通过$ http请求获得的，如果有关系的话.

ctrl.curso is predefined when the user enters the page, so I don't understand the 'source is undefined' error, since ctrl.cursois always defined. ctrl.cursois get via $http request, in case it's relevant.

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

I was using |filter: ctrl.curso before, however know I need to convert ctrl.curso to a string without accents and filtering the list based on this string.

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

Just to clarify, I'm looking for to filter the array based on the word inputed by the user. However, first I want to convert this word to a string without accents and then apply the filter itself. For example, If the user types the word 'espécie', I want to filter based on the string 'especie'.

推荐答案

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

You need to chain filters. First, you need to remove the accent on the user input:

search | removeAcentos

然后您要基于此新值过滤数组:

Then you want to filter your array based on this new value:

filter: (search | removeAcentos)

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

Note the parenthesis to ensure filters are applied in the correct order.

更新的ng-repeat的结果:

Result of the updated ng-repeat:

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

链接到使用JSFiddle

这篇关于角度过滤器可在应用过滤器之前从输入的单词中去除重音的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！