部落格 RSS 訂閱

從 Globalization Plugin 遷移
作者:Vishal Mishra
2017年11月20日

從 Cordova Globalization Plugin 遷移

Cordova Globalization Plugin 的創建目的是為了在大多數行動平台無法區分這些設定時,獲取資訊並根據使用者的地區設定、語言和時區執行操作。隨著瀏覽器中新 API 的出現,我們現在可以使用 ECMA 國際化 API 在 iOS、Android、Windows 裝置和桌面瀏覽器上實現此目標。因此,不再需要此 Cordova 外掛,並將很快停止支援。

從外掛遷移到國際化 API

Cordova Globalization Plugin 定義了一個全域的 navigator.globalization 物件,該物件提供了各種方法來存取使用者的地區設定、語言和時區。若要從瀏覽器取得偏好的語言,可以使用 navigator.globalization.getPreferredLanguage 方法,如下所示:

navigator.globalization.getPreferredLanguage(function (language) {          
    console.log('language: ' + language.value + '\n');
}, function () { 
    console.log('Error getting language\n'); 
});

可以使用以下方法找出目前的地區設定:

navigator.globalization.getLocaleName(function (locale) {          
    console.log('locale: ' + locale.value + '\n');
}, function () {
    console.log('Error getting locale\n'); 
});

ECMA 國際化 API 提供了 Intl 物件,該物件提供了語言敏感的字串比較、數字格式化以及日期和時間格式化。 首先,我們應該檢查瀏覽器是否支援該 API

if (window.Intl && typeof window.Intl === 'object') {
    console.log('API available');
}

可以使用 navigator 物件從瀏覽器中找到偏好的語言標籤

console.log(navigator.language);

可以使用 Intl.getCanonicalLocales(locales) 方法找到地區設定名稱。locales 是一個字串值或字串值陣列,其中包含語言標籤。然後可以如下所示取得地區設定名稱

Intl.getCanonicalLocales('EN-US'); // ["en-US"]
Intl.getCanonicalLocales(['EN-US', 'Fr']); // ["en-US", "fr"]

從 Cordova Globalization Plugin 遷移的另一個例子可以在此範例中看到:navigator.globalization.dateToString 方法。此方法在 Cordova 外掛中使用,如下所示:

navigator.globalization.dateToString(
    new Date(),
    function (date) { 
        alert('date: ' + date.value + '\n'); 
    },
    function () { 
        alert('Error getting dateString\n'); 
    },
    { formatLength: 'short', selector: 'date' }
);

可以使用以下程式碼,透過國際化 API 獲得類似的結果

var date = new Date();
console.log(new Intl.DateTimeFormat().format(date));

這裡是一個很好的資源,可以找到更多關於 ECMA 國際化 API 中各種方法的資訊。

我們誠摯地接受並感謝您的回饋!