根据用户区域设置过滤字符串列表

Question

在使用AngularJS 1.6处理JavaScript项目时,我有一个我想要过滤的字符串列表.例如,假设我的列表包含árbol,cigüeña,nido和tubo.

当用西班牙语过滤字符串时,如果我过滤了"u",我会期望出现cigüeña和tubo,这对西班牙人来说是最自然的结果.然而,在德语中并非如此 - 你和ü是不同的字母,因此德国人不希望在名单上看到cigüeña.所以我正在寻找一种方法让我的列表过滤知道用户的语言环境.

我碰巧有一个包含许多变音符号的对象,这样:

diacritics["á"] = "a";
diacritics["ü"] = "u";
// and so on...

这就是我的过滤代码:

function matches(word, search) {
    var cleanWord = removeDiacritics(word.toLowerCase());
    var cleanSearch = removeDiacritics(search.toLowerCase());
    return cleanWord.indexOf(cleanSearch) > -1;
}

function removeDiacritics(word) {
    function match(a) {
        return diacritics[a] || a;
    }
    return text.replace(/[^\u0000-\u007E]/g, match);
}

上面的代码只删除了所有变音符号,所以我想让它知道用户的语言环境.因此,我将match()函数更改为:

function match(a) {
    if (diacritics[a] && a.localeCompare(diacritics[a] === 0) {
        return diacritics[a];
    }
    return a;
}

不幸的是,这不起作用.将"u"和"ü"与德语和西班牙语语言环境进行比较时,localeCompare函数返回相同的值,因此这不是答案.我已经查看了localeCompare方法的参考资料并尝试了使用和灵敏度选项,但它们似乎没有太多帮助.

我怎么能调整我的代码才能工作？有没有能够正确处理这个问题的图书馆？

Answer 1

我将通过navigator（src）（代表用户代理的对象）直接从浏览器获取用户的区域设置：

\n\n

var language = navigator.language;\n

\n\n

在我的例子中，这将分配language用户浏览器的区域设置代码en-US。我发现这个网站有助于查找区域设置代码来测试世界其他地区。

\n\n

我的strFromLocale功能和你的差不多removeDiacritics：

\n\n

function strFromLocale(str) {\n    function match(letter) {\n        function letterMatch(letter, normalizedLetter) {\n            var location = new Intl.Collator(language, {usage: \'search\', sensitivity: \'base\' }).compare(letter, normalizedLetter);\n            return (location == 0)\n        }\n        normalizedLetter = letter.normalize(\'NFD\').replace(/[\\u0300-\\u036f]/gi, "")\n        if ( letterMatch(letter, normalizedLetter) ) {\n            return normalizedLetter;\n        } else {\n            return letter;\n        }\n    }\n    return str.replace(/[^\\u0000-\\u007E]/g, match);\n}\n

\n\n

Intl.Collator请注意带有( src )的行。此行将变音符号与变音符号的规范化字母进行比较，并检查给定语言的字母表的位置差异。所以：

\n\n

/* English */\nnew Intl.Collator(\'en-US\', {usage: \'search\', sensitivity: \'base\' }).compare(\'u\', \'\xc3\xbc\');\n>>> 0\n\n/* Swedish */\nnew Intl.Collator(\'sv\', {usage: \'search\', sensitivity: \'base\' }).compare(\'u\', \'\xc3\xbc\');\n>>> -1\n\n/* German */\nnew Intl.Collator(\'de\', {usage: \'search\', sensitivity: \'base\' }).compare(\'u\', \'\xc3\xbc\');\n>>> -1\n

\n\n

正如您在函数中看到的letterMatch，当且仅当 的结果Intl.Collator是 时0，它才返回 true，这表明该语言的字母表中的字母没有位置差异，这意味着可以安全地替换。

\n\n

至此，以下是该strFromLocale功能的一些测试：

\n\n

var language = navigator.language; // en-US\nstrFromLocale("cig\xc3\xbce\xc3\xb1a");\n>>> ciguena\n\nvar language = \'sv\' // Swedish\nstrFromLocale("cig\xc3\xbce\xc3\xb1a");\n>>> cig\xc3\xbcena\n\nvar language = \'de\' // German\nstrFromLocale("cig\xc3\xbce\xc3\xb1a");\n>>> cig\xc3\xbcena\n\nvar language = \'es-mx\' // Spanish - Mexico\nstrFromLocale("cig\xc3\xbce\xc3\xb1a");\n>>> cigue\xc3\xb1a\n

\n