Cordova - 全球化
此插件用于获取有关用户语言环境、日期和时区、货币等的信息。
步骤 1 - 安装全球化插件
打开命令提示符并输入以下代码安装插件
C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-globalization
步骤 2 - 添加按钮
我们将向 index.html 添加几个按钮,以便能够调用我们稍后将创建的不同方法。
<button id = "getLanguage">LANGUAGE</button> <button id = "getLocaleName">LOCALE NAME</button> <button id = "getDate">DATE</button> <button id = "getCurrency">CURRENCY</button>
步骤 3 - 添加事件监听器
事件监听器将添加到 index.js 文件中的 getDeviceReady 函数内,以确保我们的应用和 Cordova 在我们开始使用之前已加载。
document.getElementById("getLanguage").addEventListener("click", getLanguage); document.getElementById("getLocaleName").addEventListener("click", getLocaleName); document.getElementById("getDate").addEventListener("click", getDate); document.getElementById("getCurrency").addEventListener("click", getCurrency);
步骤 4A - 语言函数
我们使用的第一个函数返回客户端设备的 BCP 47 语言标签。我们将使用 getPreferredLanguage 方法。该函数有两个参数 onSuccess 和 onError。我们将在 index.js 中添加此函数。
function getLanguage() { navigator.globalization.getPreferredLanguage(onSuccess, onError); function onSuccess(language) { alert('language: ' + language.value + ' '); } function onError(){ alert('Error getting language'); } }
一旦我们按下 LANGUAGE 按钮,警报就会显示在屏幕上。
步骤 4B - 区域设置函数
此函数返回客户端本地设置的 BCP 47 标签。此函数与我们之前创建的函数类似。唯一的区别是我们这次使用的是 getLocaleName 方法。
function getLocaleName() { navigator.globalization.getLocaleName(onSuccess, onError); function onSuccess(locale) { alert('locale: ' + locale.value); } function onError(){ alert('Error getting locale'); } }
当我们点击 LOCALE 按钮时,警报将显示我们的语言环境标签。
步骤 4C - 日期函数
此函数用于根据客户端的语言环境和时区设置返回日期。date 参数是当前日期,options 参数是可选的。
function getDate() { var date = new Date(); var options = { formatLength:'short', selector:'date and time' } navigator.globalization.dateToString(date, onSuccess, onError, options); function onSuccess(date) { alert('date: ' + date.value); } function onError(){ alert('Error getting dateString'); } }
我们现在可以运行应用程序并按 DATE 按钮查看当前日期。
我们将展示的最后一个函数是根据客户端的设备设置和 ISO 4217 货币代码返回货币值。您可以看到概念是相同的。
function getCurrency() { var currencyCode = 'EUR'; navigator.globalization.getCurrencyPattern(currencyCode, onSuccess, onError); function onSuccess(pattern) { alert('pattern: ' + pattern.pattern + ' ' + 'code: ' + pattern.code + ' ' + 'fraction: ' + pattern.fraction + ' ' + 'rounding: ' + pattern.rounding + ' ' + 'decimal: ' + pattern.decimal + ' ' + 'grouping: ' + pattern.grouping); } function onError(){ alert('Error getting pattern'); } }
CURRENCY按钮将触发警报,向用户显示货币模式。
此插件提供其他方法。您可以在下表中看到所有内容。
方法 | 参数 | 详细信息 |
---|---|---|
getPreferredLanguage | onSuccess、onError | 返回客户端的当前语言。 |
getLocaleName | onSuccess、onError | 返回客户端当前的语言环境设置。 |
dateToString | date、onSuccess、onError、options | 根据客户端的语言环境和时区返回日期。 |
stringToDate | dateString、onSuccess、onError、options | 根据客户端的设置解析日期。 |
getCurrencyPattern | currencyCode、onSuccess、onError | 返回客户端的货币模式。 |
getDatePattern | onSuccess、onError、options | 返回客户端的日期模式。 |
getDateNames | onSuccess、onError、options | 根据客户端的设置返回月份、星期或日子的名称数组。 |
isDayLightSavingsTime | date、successCallback、errorCallback | 用于根据客户端的时区和日历确定夏令时是否有效。 |
getFirstDayOfWeek | onSuccess, onError | 根据客户端设置返回一周的第一天。 |
numberToString | number, onSuccess, onError, options | 根据客户端设置返回数字。 |
stringToNumber | string、onSuccess、onError、options | 根据客户端的设置解析数字。 |
getNumberPattern | onSuccess、onError、options | 根据客户端的设置返回数字模式。 |