MomentJS教程:国际化

Moment.js 对国际化具有强大的支持。

可以加载多个语言环境并在它们之间轻松地切换。

除了分配全局的语言环境外,还可以将语言环境分配给特定的 moment。

设置语言环境 (全局) 1.0.0+

// 从 2.8.1 开始
moment.locale(String);
moment.locale(String[]);
moment.locale(String, Object);

// 废弃于 2.8.1
moment.lang(String);
moment.lang(String[]);
moment.lang(String, Object);

默认情况下,Moment.js 随附英语(美国)语言环境字符串。 如果需要其他语言环境,则可以将它们加载到 Moment.js 中以供随后使用。

要加载语言环境,则将键和字符串值传给 moment.locale

可以在自定义章节中找到有关语言环境包的各个部分的更多详细信息。

moment.locale('fr', {
    months : 'janvier_février_mars_avril_mai_juin_juillet_août_septembre_octobre_novembre_décembre'.split('_'),
    monthsShort : 'janv._févr._mars_avr._mai_juin_juil._août_sept._oct._nov._déc.'.split('_'),
    monthsParseExact : true,
    weekdays : 'dimanche_lundi_mardi_mercredi_jeudi_vendredi_samedi'.split('_'),
    weekdaysShort : 'dim._lun._mar._mer._jeu._ven._sam.'.split('_'),
    weekdaysMin : 'Di_Lu_Ma_Me_Je_Ve_Sa'.split('_'),
    weekdaysParseExact : true,
    longDateFormat : {
        LT : 'HH:mm',
        LTS : 'HH:mm:ss',
        L : 'DD/MM/YYYY',
        LL : 'D MMMM YYYY',
        LLL : 'D MMMM YYYY HH:mm',
        LLLL : 'dddd D MMMM YYYY HH:mm'
    },
    calendar : {
        sameDay : '[Aujourd’hui à] LT',
        nextDay : '[Demain à] LT',
        nextWeek : 'dddd [à] LT',
        lastDay : '[Hier à] LT',
        lastWeek : 'dddd [dernier à] LT',
        sameElse : 'L'
    },
    relativeTime : {
        future : 'dans %s',
        past : 'il y a %s',
        s : 'quelques secondes',
        m : 'une minute',
        mm : '%d minutes',
        h : 'une heure',
        hh : '%d heures',
        d : 'un jour',
        dd : '%d jours',
        M : 'un mois',
        MM : '%d mois',
        y : 'un an',
        yy : '%d ans'
    },
    dayOfMonthOrdinalParse : /\d{1,2}(er|e)/,
    ordinal : function (number) {
        return number + (number === 1 ? 'er' : 'e');
    },
    meridiemParse : /PD|MD/,
    isPM : function (input) {
        return input.charAt(0) === 'M';
    },
    // 如果子午线单位未在12左右分开,则实现此函数(以 locale/id.js 为例)。
    // meridiemHour : function (hour, meridiem) {
    //     return /* 0-23 小时,给定的子午线令牌和 1-12小时 */ ;
    // },
    meridiem : function (hours, minutes, isLower) {
        return hours < 12 ? 'PD' : 'MD';
    },
    week : {
        dow : 1, // 星期一是一周的第一天。
        doy : 4  // 用于判断一年中的第一周。
    }
});

有关 week.dow 和 week.doy 的详细信息可以在自定义章节中找到。

加载语言环境之后,则它会成为活动的语言环境。 要更改活动的语言环境,只需使用已加载的语言环境的键调用 moment.locale

moment.locale('fr');
moment(1316116057189).fromNow(); // il y a une heure
moment.locale('en');
moment(1316116057189).fromNow(); // an hour ago

从 2.21.0 开始,如果语言环境不可用,则 Moment 将会 console.warn

从 2.8.0 开始,更改全局的语言环境不会影响已存在的实例。

moment.locale('fr');
var m = moment(1316116057189);
m.fromNow(); // il y a une heure

moment.locale('en');
m.fromNow(); // il y a une heure
moment(1316116057189).fromNow(); // an hour ago

moment.locale 返回使用的语言环境。 这很有用,因为如果 Moment 不知道你指定的语言环境,它就不会更改语言环境。

moment.locale('fr'); // 'fr'
moment.locale('tq'); // 'fr'

也可以指定一个语言环境的列表,Moment 将会使用它具有本地化的第一个语言环境。

moment.locale(['tq', 'fr']); // 'fr'

Moment 还将会尝试从最特定到最不特定的语言环境说明符子字符串,直到找到它知道的语言环境。 当为 Moment 提供从用户环境中拉出的语言环境字符串(例如 window.navigator.language)时,这很有用。

moment.locale('en-NZ'); // 'en'

最后,Moment 将会通过一系列语言环境及其子字符串进行智能搜索。

moment.locale(['en-NZ', 'en-AU']); // 'en-au', 而不是 'en'

设置语言环境 (局部) 1.7.0+

// 从 2.8.1 版本开始
moment().locale(String|Boolean);

// 废弃于 2.8.1 版本
moment().lang(String|Boolean);

当传递可能需要格式化为不同语言环境的 moment 时,全局的语言环境配置可能会出现问题。

moment.locale('en'); // 默认的语言环境为英语。
var localLocale = moment();

localLocale.locale('fr'); // 将此实例设置为使用法语。
localLocale.format('LLLL'); // dimanche 15 juillet 2012 11:01
moment().format('LLLL'); // Sunday, July 15 2012 11:01 AM

moment.locale('es'); // 将全局的语言环境更改为西班牙语。
localLocale.format('LLLL'); // dimanche 15 juillet 2012 11:01
moment().format('LLLL'); // Domingo 15 Julio 2012 11:01

localLocale.locale(false); // 重置实例的语言环境。
localLocale.format('LLLL'); // Domingo 15 Julio 2012 11:01
moment().format('LLLL'); // Domingo 15 Julio 2012 11:01

如果不带参数调用 moment#locale,则会获取该 moment 使用的语言环境配置。

var fr = moment().locale('fr');
fr.localeData().months(moment([2012, 0])) // "janvier"
fr.locale('en');
fr.localeData().months(moment([2012, 0])) // "January"

如果需要访问 moment 的语言环境数据,这是首选的方式。

从 2.3.0 开始,还可以指定一个语言环境标识符的数组。 它的工作方式与在全局的语言环境配置中相同。

加载语言环境 (NodeJS) 1.0.0+

moment.locale(String);

在 NodeJS 中加载语言环境非常简单。 如果 moment-root/locale/ 中有一个以该键命名的语言环境文件,则对 moment.locale 的第一次调用将会加载该文件。

var moment = require('moment');
moment.locale('fr');
moment(1316116057189).fromNow(); // il y a une heure

如果希望你的语言环境受支持,则使用所需的语言环境和单元测试文件创建一个对 develop 分支的 pull request。

加载语言环境 (浏览器) 1.0.0+

// 从 2.8.1 开始
moment.locale(String, Object);

// 废弃于 2.8.1
moment.lang(String, Object);

在浏览器中加载语言环境仅需要包括语言环境文件。 确保指定字符集以防止编码问题。

<script src="moment.js"></script>
<script src="locale/fr.js" charset="UTF-8"></script>
<script src="locale/pt.js" charset="UTF-8"></script>
<script>
  moment.locale('fr');  // 设置默认/全局的语言环境。
  // ...
</script>

有所有语言环境的压缩版本:

<script src="moment.js"></script>
<script src="min/locales.js" charset="UTF-8"></script>

为了最大程度地减少 HTTP 请求,请使用 Grunt 任务以自定义的语言环境列表来编译 Moment:

grunt transpile:fr,it
<script src="min/moment-with-locales.custom.js" charset="UTF-8"></script>

如果使用 JSPM 作为插件管理器,则应在 lib 中添加语言环境。

import * as moment from 'moment';
import 'moment/locale/fr';

注意:语言环境文件是以 UMD 风格定义的,因此它们应在所有环境中无缝运行。

新增语言环境

要将你的语言环境添加到 Moment.js,则提交一个 pull request 并带上语言环境文件和测试文件。 可以在 moment/src/locale/fr.js 和 moment/src/test/locale/fr.js 中查看示例。

要在 Node.js 中运行测试,则先执行 npm install,然后执行 grunt

如果所有的测试均通过,则提交 pull request,感谢你的贡献!

locale() 1.6.0+

// 从 2.8.1 版本开始
moment.locale();

// 废弃于 2.8.1 版本
moment.lang();

如果需要经常更改语言环境,则可能想知道当前正在使用的语言环境。 这可以不带任何参数调用 moment.locale

zmoment.locale('en'); // 设为英语
moment.locale(); // 返回 'en'
moment.locale('fr'); // 设为法语
moment.locale(); // 返回 'fr'

从 2.12.0 版本开始,可以列出所有已加载并可以使用的语言环境:

moment.locales()

months()/weekdays() 2.3.0+

moment.months()
moment.monthsShort()
moment.weekdays()
moment.weekdaysShort()
moment.weekdaysMin()

有时需要在语言环境中获取月份或工作日的列表,例如当填充下拉菜单时。

moment.months();

返回当前语言环境中的月份列表。

[ 'January',
  'February',
  'March',
  'April',
  'May',
  'June',
  'July',
  'August',
  'September',
  'October',
  'November',
  'December' ]

同样,moment.monthsShort 返回缩写的月份名称,moment.weekdaysmoment.weekdaysShortmoment.weekdaysMin 返回工作日的列表。

可以将整数传给每个函数以获取特定的月份或工作日。

从 2.13.0 开始,可以将布尔值作为 weekday 函数的第一个参数传入。 如果为 true,则将会按特定于语言环境的顺序返回工作日。 例如,在阿拉伯语言环境中,星期六是一周的第一天,因此:

moment.locale('ar');
moment.weekdays(true); // 以阿拉伯语列出周六至周五的工作日列表
moment.weekdays(true, 2); // 将会以阿拉伯语返回星期一

注意:如果缺少语言环境特定的参数,则无论星期几是本地的第一天,工作日始终将星期日作为索引 0。

当格式化月份名称时,某些语言环境会特别考虑。 例如,荷兰语格式化月份的缩写时不带末尾的句号,但前提是格式化破折号之间的月份。 months 方法支持传入格式,以便在适当的上下文中列出月份。

moment.locale('nl');
moment.monthsShort(); // ['jan.', 'feb.', 'mrt.', ...]
moment.monthsShort('-MMM-'); // [ 'jan', 'feb', 'mrt', ...]

最后,可以结合使用格式选项和整数选项。

moment.monthsShort('-MMM-', 3); // 'apr'

localeData() 2.8.0+

localeData = moment.localeData()
localeData.months(Moment)
localeData.months()
localeData.monthsShort(Moment)
localeData.monthsShort()
localeData.monthsParse(String)
localeData.weekdays(Moment)
localeData.weekdays()
localeData.weekdays(Boolean)      ## 新增于 2.24.0,按语言环境对工作日进行排序。
localeData.weekdaysShort(Moment)
localeData.weekdaysShort()
localeData.weekdaysShort(Boolean) ## 新增于 2.24.0,按语言环境对工作日进行排序。
localeData.weekdaysMin(Moment)
localeData.weekdaysMin()
localeData.weekdaysMin(Boolean)   ## 新增于 2.24.0,按语言环境对工作日进行排序。
localeData.weekdaysParse(String)
localeData.longDateFormat(String)
localeData.isPM(String)
localeData.meridiem(Number, Number, Boolean)
localeData.calendar(String, Moment)
localeData.relativeTime(Number, Boolean, String, Boolean)
localeData.pastFuture(Number, String)
localeData.ordinal(Number)
localeData.preparse(String)
localeData.postformat(String)
localeData.week(Moment)
localeData.invalidDate()
localeData.firstDayOfWeek()
localeData.firstDayOfYear()

可以通过 moment.localeData(key) 函数访问当前加载的语言环境的属性。 它返回当前语言环境或具有给定键的语言环境:

// 获取当前的语言环境
var currentLocaleData = moment.localeData();
var frLocaleData = moment.localeData('fr');

返回的对象具有以下方法:

localeData.months(aMoment);  // aMoment 的完整月份名称
localeData.monthsShort(aMoment);  // aMoment 的简短月份名称
localeData.monthsParse(longOrShortMonthString);  // 返回输入的月份 id (0 至 11)
localeData.weekdays(aMoment);  // aMoment 的完整工作日名称
localeData.weekdaysShort(aMoment);  // aMoment 的简短工作日名称
localeData.weekdaysMin(aMoment);  // aMoment 的最小工作日名称
localeData.weekdaysParse(minShortOrLongWeekdayString);  // 返回输入的工作日 id (0 至 6)
localeData.longDateFormat(dateFormat);  // 返回缩写的日期时间格式(LT、L、LL 等)的完整格式
localeData.isPM(amPmString);  // 如果 amPmString 代表 PM,则返回 true
localeData.meridiem(hours, minutes, isLower);  // 返回大写/小写的特定日期时间的 am/pm 字符串
localeData.calendar(key, aMoment);  // 返回用于日历表示的格式。键是 'sameDay'、'nextDay'、'lastDay'、'nextWeek'、'prevWeek'、'sameElse' 之一
localeData.relativeTime(number, withoutSuffix, key, isFuture);  // 返回相对时间的字符串,键是 's'、'm'、'mm'、'h'、'hh'、'd'、'dd'、'M'、'MM'、'y'、'yy' 之一。当 number 为 1 时为单个字母
localeData.pastFuture(diff, relTime);  // 根据差异将 relTime 字符串转换为过去或未来的字符串
localeData.ordinal(number);  // 将数字转换为序数字符串 1-> 1st
localeData.preparse(str);  // 在解析每个输入字符串之前调用
localeData.postformat(str);  // 在格式化每个字符串后调用
localeData.week(aMoment);  // 返回 aMoment 的周年
localeData.invalidDate();  // 返回 'Invalid date' 的翻译
localeData.firstDayOfWeek();  // 0-6 (星期日至星期六)
localeData.firstDayOfYear();  // 0-15 用于判断年份的第一周

有关 firstDayOfYear 的详细信息可以在自定义章节中查看。

locale('x-pseudo') 2.13.0+

moment.locale('x-pseudo')

从 2.13.0 版本开始,moment 可选地包含伪语言环境。 此语言环境将会使用非常明显变化的数据填充日期。 伪语言环境在测试时很有用,因为它们可以清楚地显示已定位和未定位的数据。 只需包含伪语言环境,并将 moment 的语言环境设置为 x-pseudo。 Moment 中的文本将会非常容易发现。

moment.locale('x-pseudo');
moment().format('LLL'); //14 F~ébrú~árý 2010 15:25
moment().fromNow(); //'á ~féw ~sécó~ñds á~gó'
moment().calendar(); //'T~ódá~ý át 02:00'

作者:terry,如若转载,请注明出处:https://www.web176.com/momentjs/2368.html

(0)
打赏 支付宝 支付宝 微信 微信
terryterry
上一篇 2021年4月7日 下午3:35
下一篇 2021年4月7日 下午3:50

相关推荐

发表回复

登录后才能评论