javascript - How do I change the language of moment.js?

Question

I am trying to change the language of the date which is being set by moment.js. The default one is English, but I want to set the German language. These is what I tried:

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

It’s giving NaN.

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

This isn’t even reacting.

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

No change: this is still producing a result in English.

How is this possible?

score 387 · Accepted Answer

您需要 moment.lang （WARNING :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'

总之，调用locale全局moment设置所有未来moment实例的语言环境，但不返回moment. 调用locale一个实例，为该实例设置它并返回该实例。

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

score 280 · Accepted Answer

我还必须导入语言：

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

然后像往常一样使用时刻

alert(moment(date).fromNow())

score 56 · Accepted Answer

最快的方法：使用 Bower 安装

我刚刚在我的 html 项目中安装了带有 bower 的时刻并链接de.js为 javascript 资源。

bower install moment --save

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

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

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

将 不再需要 在源代码中执行moment.locale("de").or 。moment.lang("de").

只需像这样链接您想要的语言环境：

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

Or you can link the libraries without the bower_components path, if you downloaded moment.js 1990ies-style via right-click, which still works fine in most scenarios.

score 44 · Accepted Answer

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

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

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

score 18 · Accepted Answer

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

score 13 · Accepted Answer

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

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

score 12 · Accepted Answer

经过努力，这对我来说适用于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>
  );
}

score 6 · Accepted Answer

流星用户：

在meteor中默认没有安装语言环境，你只能通过默认安装获得'en'语言环境。

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

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

但在您安装所需的语言环境之前，它将保持为英文。

有一种很好、干净的方法可以在流星中添加单个语言环境（由rzymek提供）。

以通常的流星方式安装moment包：

meteor add rzymek:moment

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

meteor add rzymek:moment-locale-it

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

meteor add rzymek:moment-locales

score 6 · Accepted Answer

6

在 2.18.1 及以后的时刻：

  moment.locale("de");
  var m = moment().format("LLL")

于 2017-07-21T08:36:08.927 回答

score 3 · Accepted Answer

对我来说，需要做出一些改变（2.20 版）

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

所以这意味着：

moment.locale('de');
var now = moment();
now.format('LLL');

另外，记得使用moment-with-locale.js. 该文件包含所有语言环境信息并且文件大小较大。下载locale文件夹是不够的。如有必要，将名称更改为moment.js。moment-with-locale.js在我的情况下，Django 只是拒绝加载。

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

score 3 · Accepted Answer

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

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

注意 import 语句中的 src

score 3 · Accepted Answer

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

moment.updateLocale('de');

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

score 3 · Accepted Answer

<!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>

演示

score 3 · Accepted Answer

当我与 gulp 和朋友一起使用 webpack 时（这个生成器为我设置了一切），我不得不对 bower.json 文件进行更改。我必须覆盖 moment 包的默认导入并选择所有语言附带的文件：

"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"
  }
}

score 3 · Accepted Answer

根据版本更改时刻js语言

版本：2.8+

moment.locale('hi');

版本：2.5.1

moment.lang('hi');

score 3 · Accepted Answer

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

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

export class AppModule {

  constructor() {
    moment.locale('ru');
  }
}

score 3 · Accepted Answer

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

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

// Then use it as you always do. 
moment(yourDate).format("MMMM Do YYYY, h:mm a")

score 3 · Accepted Answer

3

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

于 2017-06-04T03:28:20.743 回答

score 1 · Accepted Answer

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

score 0 · Accepted Answer

首先调用，p5.js 和 moment-with-locales.js，然后执行如下代码，你会得到你的结果。

在这个结果中，我用不同的语言显示了月份名称:)

请检查代码：

     var monthNameEnglish = moment().locale('en-gb').format('MMMM');
    document.getElementById('monthNameEnglish').innerHTML =  monthNameEnglish;
    
    
         var monthNameGerman = moment().locale('de').format('MMMM');
    document.getElementById('monthNameGerman').innerHTML =  monthNameGerman;

<!DOCTYPE html>
<html>
    <head>
        <title>P5.js and Moment.js</title>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/p5.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.js"></script>
    
    <h3>English Version Month Name</h3>
    
    <p id="monthNameEnglish"></p>
    
    <h3> German Version Month Name</h3>
    
    <p id="monthNameGerman"></p>
        
    </head>
    <body>
    </body>
</html>

score 0 · Accepted Answer

对于那些在异步环境中工作的人，moment在按需加载语言环境时会出现意外行为。

代替

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

颠倒顺序

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

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

score 0 · Accepted Answer

要使用 moment（2.8.0 之后的版本）更改区域设置，请执行以下步骤。

在 index.html 中加载时刻语言环境文件，如下所示 <script src="../node_modules/moment/locale/it.js"></script>
根据需要设置语言环境 - moment.locale('it');
现在moment.locale()将返回“它”
您可以将 moment 与任何语言一起使用，例如JavaScript、Angular、node 等。

javascript - How do I change the language of moment.js?

22 回答 22

最快的方法：使用 Bower 安装

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

Related

Reference