如何更改moment.js的语言？

196

我正在尝试更改moment.js设置的日期的语言。默认语言是英语，但是我想设置德语。这些是我尝试过的：

var now = moment().format("LLL").lang("de");

它给NaN。

var now = moment("de").format("LLL");

这甚至没有反应。

var now = moment().format("LLL", "de");

不变：这仍然会产生英文结果。

这怎么可能？

javascript  momentjs 
— 捐赠者
source
— PiLHA

Answers:

303

您需要moment.lang（警告：lang()从moment开始不推荐2.8.0使用，请locale()改用）：

moment.lang("de").format('LLL');

http://momentjs.com/docs/#/i18n/

从v2.8.1开始，moment.locale('de')设置本地化，但不返回moment。一些例子：

var march = moment('2017-03')
console.log(march.format('MMMM')) // 'March'

moment.locale('de') // returns the new locale, in this case 'de'
console.log(march.format('MMMM')) // 'March' still, since the instance was before the locale was set

var deMarch = moment('2017-03')
console.log(deMarch.format('MMMM')) // 'März'

// You can, however, change just the locale of a specific moment
march.locale('es')
console.log(march.format('MMMM')) // 'Marzo'

总而言之，调用localeGlobal会moment为所有将来的moment实例设置语言环境，但不会返回的实例moment。调用locale一个实例，为该实例设置它，然后返回该实例。

另外，如Shiv在评论中所述，请确保使用“ moment-with-locales.min.js”而不是“ moment.min.js”，否则将无法使用。

— 卡利
source
1
在文档中，您可以这样做来创建特定于语言的即时实例。如果先设置格式，该语言将不会处理。或者，您可以执行类似的操作var deMoment = moment(); deMoment.lang('de')并重用deMoment脚本，而不用花时间在整个脚本中。
— kalley
32
如果您使用“ moment.min.js”，它将无法正常工作；您需要“ moment-with-locales.min.js”
— Shiv 2016年
2
更新：Deprecation warning: moment().lang() is deprecated. Instead, use moment().localeData() to get the language configuration. Use moment().locale() to change languages. Arguments: fr
— Abdelouahab
8
您需要以其他方式导入想要的语言，否则将无法正常工作： import moment from 'moment'; import localization from 'moment/locale/de' moment().locale("de", localization).format('LLL')
— Blue Bot'Sept
2
从“ moment / min / moment-with-locales”导入时刻；
— leojnxs 18-10-29
166

我还必须导入语言：

import moment from 'moment'
import 'moment/locale/es'  // without this line it didn't work
moment.locale('es')

然后像平常一样使用片刻

alert(moment(date).fromNow())
— 阿古登多
source
15
您的回答比其他答案更有帮助，因为您提到过import 'moment/locale/es'
— Artem Solovev
4
是的，这是正确的答案...谢谢，我一直在拉头发，想知道为什么它不起作用。但这是必须为任何可能使用的语言类型导入的真正痛苦。一定有更好的方法。
— 疯狂
1
感谢您解释导入特定语言环境。
— 费尔南多·莱昂
根据文档，如果有人希望包括所有语言环境，则他/她可以使用此语言require("moment/min/locales.min");或使用importimport 'moment/min/locales.min'
— kamran
谢谢，正是我所需要的
— Davide P.
55

最快的方法：使用Bower安装

我刚刚安装了Bower并de.js在html项目中链接为javascript资源。

bower install moment --save

您也可以手动下载moment.js和de.js。

在您的项目中链接“ de.js”

de.js在我的主项目文件中链接会自动更改对矩类及其方法的所有访问的语言环境。

将有 没有必要再去做一个moment.locale("de").或者 moment.lang("de"). 源代码。

只需像这样链接所需的语言环境：

<script src="/bower_components/moment/moment.js"></script>
<script src="/bower_components/moment/locale/de.js"></script>

或者bower_components，如果通过右键单击下载了moment.js 1990ies样式的文件，则可以不带路径地链接库，这在大多数情况下仍然可以正常工作。

— 史蒂夫·K
source
2
这应该是正确的答案。只需将所需的本地链接到。<script src="/bower_components/moment/locale/de.js"></script>它现在对我有用。
— mles
8
“将不再需要在源代码中执行moment.locale（“ de”）。或moment.lang（“ de”）。”。我认为这对于更改语言环境的动态应用程序仍然有用。就像您理论上可以通过我的角度应用程序中的lang / country下拉菜单更改我的应用程序中的语言环境，然后moment应该动态更改格式，我认为我会用moment.locale（$ lang）
— Armyofda12mnkeys
可以，但是您仍然需要在我的测试中将JavaScript文件加载到index.html中。这在2017年5月仍然是一个问题，也许现在应该在他们的文档中包括这个问题。
— 史蒂夫·K
37

使用momentjs 2.8+，请执行以下操作：

moment.locale("de").format('LLL');

http://momentjs.com/docs/#/i18n/

— 纳希纳斯
source
它应该工作；您能否提供一个示例，说明它在哪些地方不起作用，还如何使用moment（是否通过npm安装了它，等等）？
— omn​​inonsense
4
对于最近的时刻（我在2.18.1中进行了测试），请使用以下代码：moment.locale（“ de”）; var m = moment（）。format（“ LLL”）
— apadana
1
apadana是正确的：您使用设置了语言环境moment.locale('de')，然后创建了一个新对象，该对象表示now的日期moment()（请注意括号），然后format('LLL')是。括号很重要。在2.20中测试。另外，请记住使用moment-with-locale.js，如有必要，将名称更改为moment.js。Django就moment-with-locale.js我而言拒绝加载。
— WesternGun
1
如果该程序不起作用，请尝试以下一种方法： moment().locale('de').format('LLL');
— Anthony Kal '18
这是一个不错的选择，只是别忘了导入您要使用的语言环境（cfr。Agu Dondo的答案）。
— Jeroen Crevits
13

您需要添加moment.lang(navigator.language)脚本。

并且还必须添加要在其中显示的每个国家/地区的语言环境：例如，对于GB或FR，您需要在moment.js库中添加该语言环境格式。momentjs文档中提供了此类格式的示例。如果您没有在moment.js中添加这种格式，那么它总是会选择美国语言环境，因为这是我目前唯一看到的语言环境。

— 智能编码器
source
如果他们的浏览器是在“恩”什么，他们正在阅读“ES”，那么它只会显示的时间在“恩”
— 彼得俄罗斯
12

结束于2017年/ 2018年：他人的答案有太多旧代码需要编辑，因此这里是我的替代答案：

与要求

let moment = require('moment');
require('moment/locale/fr.js');
// or if you want to include all locales:
require("moment/min/locales.min");

与进口

import moment from 'moment';
import 'moment/locale/fr';
// or if you want to include all locales:
require("moment/min/locales.min");

用：

moment.locale('fr');
moment().format('D MMM YY');  // Correct, set default global format 
// moment.locale('fr').format('D MMM YY') //Wrong old versions for global default format

带时区

*要求：

require('moment-range');
require('moment-timezone');

*进口：

import 'moment-range';
import 'moment-timezone';

使用区域：

const newYork    = moment.tz("2014-06-01 12:00", "America/New_York");
const losAngeles = newYork.clone().tz("America/Los_Angeles");
const london     = newYork.clone().tz("Europe/London");

格式化日期的功能 

const ISOtoDate = function (dateString, format='') {

 // if date is not string use conversion:
 // value.toLocaleDateString() +' '+ value.toLocaleTimeString();

  if ( !dateString ) {
    return '';
  }

  if (format ) {
    return moment(dateString).format(format);
  } else  {
    return moment(dateString);  // It will use default global format
  }  
};
— Stackdave
source
唯一对我import moment from 'moment/min/moment-with-locales';
— 有用的
@leojnxs是的，如果您想包含所有语言环境，但是只能使用一个或多个特定语言环境对每种语言进行导入
— stackdave
6

对于流星用户：

如果流星默认情况下未安装语言环境，则只能通过默认安装获得“ en”语言环境。

因此，您可以使用其他答案中正确显示的代码：

moment.locale('it').format('LLL');

但是在您安装所需的语言环境之前，它将一直保持英语状态。

有一种不错的，干净的方法可以在流星中暂时添加单个语言环境（由rzymek提供）。

使用通常的流星方式安装一下矩包：

meteor add rzymek:moment

然后只需添加所需的语言环境，例如意大利语：

meteor add rzymek:moment-locale-it

或者，如果您确实要添加所有可用的语言环境（向您的页面添加约30k）：

meteor add rzymek:moment-locales
— 沃伦
source
@AntonAL很好，您给我发送了评论，我刚刚发现问题实际上不是流星问题。但是我认为我的回答非常有用。我已经修改了答案以反映这一点。
— mwarren's
谢谢！添加rzymek:moment-locale-de并成功了:)
— nooitaf
4

从时刻2.18.1开始： 

  moment.locale("de");
  var m = moment().format("LLL")
— 阿帕达纳
source
2
必须包含语言环境文件，否则将无法正常工作。
— zeleven
2
除非也导入了相关的特定时刻语言环境模块，否则已经提到这是行不通的。
— 疯狂
@Maniaque我没安装什么特别的东西，只是npm
— install-保存
3 
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>MomentJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script type="text/javascript" src="moment.js"></script>
    <script type="text/javascript" src="locale/ne.js"></script>
</head>
<body>
    <script>
        jQuery(document).ready(function($) {
            moment.locale('en'); // default the locale to English
            var localLocale = moment();

            moment.locale('ne'); // change the global locale to Nepalese
            var ne1 = localLocale.format('LLLL');
            var ne2 = moment().format('LLLL');

            $('.ne1').text(ne1);
            $('.ne2').text(ne2);
        });
    </script>
    <p class="ne1"></p>
    <p class="ne2"></p>
</body>
</html>

演示版

— 拉姆·普卡（Ram Pukar）
source
3

当我与gulp和朋友一起使用webpack（此生成器为我设置了所有内容）时，我不得不对bower.json文件进行更改。我必须覆盖一下即时包的默认导入，然后选择所有语言随附的文件：

"overrides": {
  "moment": {
    "main": [
        "min/moment-with-locales.min.js"
    ]
  }
}

这是我完整的bower.json文件：

{
  "name": "html5",
  "version": "0.0.0",
  "dependencies": {
    "angular-animate": "~1.4.2",
    "angular-cookies": "~1.4.2",
    "angular-touch": "~1.4.2",
    "angular-sanitize": "~1.4.2",
    "angular-messages": "~1.4.2",
    "angular-ui-router": "~0.2.15",
    "bootstrap-sass": "~3.3.5",
    "angular-bootstrap": "~0.13.4",
    "malarkey": "yuanqing/malarkey#~1.3.1",
    "angular-toastr": "~1.5.0",
    "moment": "~2.10.6",
    "animate.css": "~3.4.0",
    "angular": "~1.4.2",
    "lodash": "^4.13.1",
    "angular-moment": "^0.10.3",
    "angularLocalStorage": "ngStorage#^0.3.2",
    "ngstorage": "^0.3.10"
  },
  "devDependencies": {
    "angular-mocks": "~1.4.2"
  },
  "overrides": {
    "bootstrap-sass": {
      "main": [
        "assets/stylesheets/_bootstrap.scss",
        "assets/fonts/bootstrap/glyphicons-halflings-regular.eot",
        "assets/fonts/bootstrap/glyphicons-halflings-regular.svg",
        "assets/fonts/bootstrap/glyphicons-halflings-regular.ttf",
        "assets/fonts/bootstrap/glyphicons-halflings-regular.woff",
        "assets/fonts/bootstrap/glyphicons-halflings-regular.woff2"
      ]
    },
    "moment": {
      "main": [
          "min/moment-with-locales.min.js"
      ]
    }
  },
  "resolutions": {
    "angular": "~1.4.2"
  }
}
— 游戏脚本
source
在此之后，您仍然必须在输出日期之前声明/设置瞬间区域设置，对吗？
— NikZ
当然：)这只是确保您有翻译后的短语，因此您可以（即时）切换到另一种语言
— GameScripting
3

我正在使用angular2-moment，但是用法必须相似。

import { MomentModule } from "angular2-moment";
import moment = require("moment");

export class AppModule {

  constructor() {
    moment.locale('ru');
  }
}
— 德米特里
source
3

像这样很好地工作： return moment(status.created_at).locale('es').fromNow();

— 克劳迪奥·舒尔曼
source
2
尽管此代码可以回答问题，但提供有关如何和/或为什么解决问题的其他上下文将提高​​答案的长期价值。
— Badacadabra
3

我不确定发生了什么变化，但是像这样导入语言文件对我来说很有效

import 'moment/src/locale/fr';
moment.locale('fr)

注意import语句中的src

— 塔哈
source
2

对于momentjs 2.12+，请执行以下操作：

moment.updateLocale('de');

另请注意，您必须使用moment.updateLocale(localeName, config)来更改现有的语言环境。moment.defineLocale(localeName, config)应该仅用于创建新的语言环境。

— 弗朗西斯科·科斯塔
source
2

对我来说，要进行一些更改（2.20版）

  1. 您使用设置了语言环境moment.locale('de')，然后创建了一个新对象，该对象表示now的日期moment()（请注意括号），然后是format('LLL')它。括号很重要。

因此，这意味着：

moment.locale('de');
var now = moment();
now.format('LLL');
  1. 另外，请记住使用moment-with-locale.js。该文件包含所有语言环境信息，并且文件大小较大。下载locale文件夹还不够。如有必要，将名称更改为moment.js。Django就moment-with-locale.js我而言拒绝加载。

编辑：事实证明，重命名文件是没有必要的。我只是忘了在页面中调用它，所以Django认为加载它不是必要的，所以是我的错。

— 西枪
source
2

这只是通过自动检测当前用户位置而起作用。 

import moment from "moment/min/moment-with-locales";

// Then use it as you always do. 
moment(yourDate).format("MMMM Do YYYY, h:mm a")
— 穆萨·查尔斯
source
1

哎呀，笔滑了。我会解决这个问题：var moment = function(x) { return moment(x).locale('de'); }在我 看来，其他方式似乎并没有真正坚持/坚持下去。

— 罗布·詹斯
source
0

对于在异步环境中工作的用户，moment按需加载语言环境时会出现异常行为。

代替 

await import('moment/locale/en-ca');
moment.locale('en-ca');

颠倒顺序

moment.locale('en-ca');
await import('moment/locale/en-ca');

似乎语言环境已加载到当前选定的语言环境中，从而覆盖了任何先前设置的语言环境信息。因此，首先切换语言环境，然后加载语言环境信息不会导致此问题。

— 亚尼克·罗雄（Yanick Rochon）
source
0

经过努力，这对我来说适用于momentv2.26.0：

import React from "react";
import moment from "moment";
import frLocale from "moment/locale/fr";
import esLocale from "moment/locale/es";

export default function App() {
  moment.locale('fr', [frLocale, esLocale]) // can pass in 'en', 'fr', or 'es'

  let x = moment("2020-01-01 00:00:01");
  return (
    <div className="App">
      {x.format("LLL")}
      <br />
      {x.fromNow()}
    </div>
  );
}

您可以传递en，fr或es。如果需要其他语言，则必须导入语言环境并将其添加到数组中。

如果您只需要支持一种语言，则要简单一些：

import React from "react";
import moment from "moment";
import "moment/locale/fr"; //always use French

export default function App() {  
  let x = moment("2020-01-01 00:00:01");
  return (
    <div className="App">
      {x.format("LLL")}
      <br />
      {x.fromNow()}
    </div>
  );
}
— 艾伦·P。
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.