我正在尝试更改moment.js设置的日期的语言。默认是英语,但我想设置德语。以下是我的尝试:
var now = moment().format("LLL").lang("de");
它会产生NaN。
var now = moment("de").format("LLL");
这甚至不是反应。
var now = moment().format("LLL", "de");
没有变化:这仍然是用英语生成的结果。
这怎么可能呢?
我正在尝试更改moment.js设置的日期的语言。默认是英语,但我想设置德语。以下是我的尝试:
var now = moment().format("LLL").lang("de");
它会产生NaN。
var now = moment("de").format("LLL");
这甚至不是反应。
var now = moment().format("LLL", "de");
没有变化:这仍然是用英语生成的结果。
这怎么可能呢?
当前回答
我们可以使用moment.locale()方法来传递您自己的语言ex。我使用window.navigator.language (ex.en- us)在运行时传递lange。
const formatDate = date => moment(date).locale(window.navigator.language).format('LL')
其他回答
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");
Use:
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
}
};
<!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>
Demo
经过一番挣扎后,这对我来说是有效的v2.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>
);
}
——更新——
在一种情况下,像上面那样导入所有区域设置文件将使用最后导入的始终使用的区域设置(即。在上面的例子中是“es”),即使我把它设置为“fr”。似乎有效的解决方案是:
import moment from 'moment';
import 'moment/min/locales';
...
moment.locale('fr');
我使用的是angular2-moment,但用法必须相似。
import { MomentModule } from "angular2-moment";
import moment = require("moment");
export class AppModule {
constructor() {
moment.locale('ru');
}
}
当我与gulp和朋友一起使用webpack时(这个生成器为我设置了一切),我不得不对凉亭进行更改。json文件。我必须重写当前包的默认导入,并选择所有语言附带的文件:
"overrides": {
"moment": {
"main": [
"min/moment-with-locales.min.js"
]
}
}
这是我的凉亭。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"
}
}