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

   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  + '\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按鈕將觸發警報，該警報將顯示使用者的貨幣模式。

此外掛提供其他方法。您可以在下面的表格中看到所有內容。