Cordova 全球化

2018-12-28 15:04 更新

此插件用于獲取有關用戶語言區(qū)域語言,日期和時區(qū),貨幣等的信息。

步驟1 - 安裝全球化插件

打開命令提示符并通過鍵入以下代碼安裝插件。

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-globalization

步驟2 - 添加按鈕

我們將向 index.html 添加幾個按鈕,以便能夠調用我們稍后將創(chuàng)建的不同方法。

<button id = "getLanguage">LANGUAGE</button>
<button id = "getLocaleName">LOCALE NAME</button>
<button id = "getDate">DATE</button>
<button id = "getCurrency">CURRENCY</button>

步驟3 - 添加事件監(jiān)聽器

事件監(jiān)聽器將被添加到 index.js 文件中的 getDeviceReady 函數(shù)中,以確保我們的應用程序和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 - 語言功能

我們使用的第一個函數(shù)返回客戶端設備的BCP 47語言標簽。我們將使用 getPreferredLanguage 方法。該函數(shù)有兩個參數(shù) onSuccess onError 我們在 index.js 中添加此函數(shù)。

function getLanguage() {
   navigator.globalization.getPreferredLanguage(onSuccess, onError);

   function onSuccess(language) {
      alert('language: ' + language.value + '\n');
   }

   function onError(){
      alert('Error getting language');
   }
	
}

一旦按下 LANGUAGE 按鈕,警報將顯示在屏幕上。

Cordova Globalization Language

步驟4B - 區(qū)域功能

此函數(shù)返回客戶端區(qū)域設置的BCP 47標簽。 此函數(shù)與我們之前創(chuàng)建的函數(shù)類似。 唯一的區(qū)別是,我們這次使用 getLocaleName 方法。

function getLocaleName() {
   navigator.globalization.getLocaleName(onSuccess, onError);

   function onSuccess(locale) {
      alert('locale: ' + locale.value);
   }

   function onError(){
      alert('Error getting locale');
   }
	
}

當我們點擊 LOCALE 按鈕時,提醒將顯示我們的區(qū)域設置標簽。

Cordova Globalization Locale

步驟4C - 日期函數(shù)

此功能用于根據(jù)客戶端的區(qū)域設置和時區(qū)設置返回日期。date 參數(shù)是當前日期, options 參數(shù)是可選的。

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');
   }
	
}

我們現(xiàn)在可以運行應用程序,然后按 DATE 按鈕查看當前日期。

Cordova Globalization Date

我們將顯示的最后一個功能是根據(jù)客戶端的設備設置和ISO 4217貨幣代碼返回貨幣值。你可以看到這個概念是一樣的。

function getCurrency() {
   var currencyCode = 'EUR';
   navigator.globalization.getCurrencyPattern(currencyCode, onSuccess, onError);

   function onSuccess(pattern) {
      alert('pattern: '  + pattern.pattern  + '\n' +
         'code: '     + pattern.code     + '\n' +
         'fraction: ' + pattern.fraction + '\n' +
         'rounding: ' + pattern.rounding + '\n' +
         'decimal: '  + pattern.decimal  + '\n' +
         'grouping: ' + pattern.grouping);
   }

   function onError(){
      alert('Error getting pattern');
   }
	
}

CURRENCY 按鈕將觸發(fā)警報,顯示用戶的貨幣模式。

Cordova Globalization Currency

此插件提供其他方法。你可以看到下面的表中所有的。

方法參數(shù)細節(jié)
getPreferredLanguageonSuccess,onError返回客戶端當前的語言。
getLocaleNameonSuccess,onError返回客戶端的當前語言環(huán)境設置。
dateToString日期,onSuccess,onError,選項根據(jù)客戶的區(qū)域設置和時區(qū)返回日期。
stringToDatedateString,onSuccess,onError,options根據(jù)客戶端的設置解析日期。
getCurrencyPatterncurrencyCode,onSuccess,onError返回客戶的貨幣模式。
getDatePatternonSuccess,onError,options返回客戶端的日期模式。
getDateNamesonSuccess,onError,options根據(jù)客戶端的設置返回月,周或天的名稱數(shù)組。
isDayLightSavingsTimedate,successCallback,errorCallback用于根據(jù)客戶端的時區(qū)和日歷確定夏令時是否活動。
getFirstDayOfWeekonSuccess,onError根據(jù)客戶端設置返回一周的第一天。
numberToStringnumber,onSuccess,onError,options根據(jù)客戶端的設置返回number。
stringToNumberstring,onSuccess,onError,options根據(jù)客戶端的設置解析一個數(shù)字。
getNumberPatternonSuccess,onError,options根據(jù)客戶端的設置返回數(shù)字模式。
以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號