Come cambio la lingua di moment.js?


198

Sto cercando di cambiare la lingua della data impostata da moment.js. Quello predefinito è l'inglese, ma voglio impostare la lingua tedesca. Ecco cosa ho provato:

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

Sta dando NaN.

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

Questo non sta nemmeno reagendo.

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

Nessun cambiamento: questo sta ancora producendo un risultato in inglese.

Com'è possibile?


Risposte:


306

È necessario moment.lang ( ATTENZIONE : lang()è obsoleto dal momento 2.8.0, utilizzare locale()invece):

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

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


A partire dalla v2.8.1, moment.locale('de')imposta la localizzazione, ma non restituisce a moment. Qualche esempio:

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'

Riassumendo, chiamare localeil globale momentimposta la locale per tutte le momentistanze future , ma non restituisce un'istanza di moment. Chiamando localeun'istanza, la imposta per quell'istanza E restituisce quell'istanza.

Inoltre, come ha detto Shiv nei commenti, assicurati di usare "moment-with-locales.min.js" e non "moment.min.js", altrimenti non funzionerà.


1
Nei documenti, puoi creare istanze specifiche del momento della lingua in questo modo. Se si formatta per prima, la lingua non verrà elaborata. In alternativa, potresti fare qualcosa di simile var deMoment = moment(); deMoment.lang('de')e riutilizzare deMomentinvece di un momento durante la tua sceneggiatura.
Kalley,

34
Se usi "moment.min.js" non funzionerà; hai bisogno di "moment-with-locales.min.js"
Shiv

2
aggiornamento: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
è necessario importare la lingua desiderata, altrimenti questo non funzionerà: import moment from 'moment'; import localization from 'moment/locale/de' moment().locale("de", localization).format('LLL')
Blue Bot

2
importare il momento da 'momento / min / momento-con-locales';
leojnxs,

169

Ho dovuto importare anche la lingua:

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

Quindi usa il momento come faresti normalmente

alert(moment(date).fromNow())

15
La tua risposta è stata più utile di altre perché ne hai parlatoimport 'moment/locale/es'
Artem Solovev,

4
Sì, questa è la risposta corretta ... grazie, mi stavo togliendo i capelli chiedendomi perché non funzionasse. Ma questo è un vero dolore dover importare per qualsiasi tipo di linguaggio che potrebbe essere utilizzato. Deve esserci un modo migliore.
Maniaque,

1
Grazie per spiegare l'importazione di impostazioni internazionali specifiche.
Fernando León,

secondo la documentazione se qualcuno vuole che vengano inclusi tutti i locali, allora può usarlo require("moment/min/locales.min");o usare importimport 'moment/min/locales.min'
kamran

Grazie, esattamente quello di cui ho bisogno
Davide P.

54

Metodo più veloce: installare con Bower

Ho appena installato moment con bower e collegato de.jscome risorsa javascript nel mio progetto html.

bower install moment --save

Puoi anche scaricare manualmente il moment.jse de.js.

Collega "de.js" nel tuo progetto

Il collegamento de.jsnel mio file di progetto principale ha modificato automaticamente le impostazioni internazionali per tutti gli accessi alla classe moment e ai suoi metodi.

Non sarà più necessario eseguire un moment.locale("de").o moment.lang("de"). nel codice sorgente.

Basta collegare le impostazioni internazionali desiderate in questo modo:

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

Oppure puoi collegare le librerie senza il bower_componentspercorso, se hai scaricato moment.js in stile anni '90 con il tasto destro del mouse, che funziona ancora bene nella maggior parte degli scenari.


2
Questa dovrebbe essere la risposta corretta. Basta collegare il locale desiderato con <script src="/bower_components/moment/locale/de.js"></script>. Funziona per me in questo momento.
mles

8
"Non sarà più necessario eseguire un moment.locale (" de "). O moment.lang (" de "). Nel codice sorgente.". Penso che questo sia ancora utile per le app dinamiche che cambiano le impostazioni locali. Come puoi teoricamente cambiare le impostazioni internazionali nella mia app tramite un menu a discesa di lingua / paese nella mia app angolare e quindi il momento dovrebbe cambiare i formati in modo dinamico, cosa che farei penso con moment.locale ($ lang)
armyofda12mnkeys

Certo, ma devi ancora caricare il file javascript nel tuo index.html nei miei test. Questo è ancora un problema a maggio 2017, forse il momento dovrebbe includerlo nei loro documenti.
Steve K,

37

Con momentjs 2.8+, procedi come segue:

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

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


Si dovrebbe lavorare; puoi fornire un esempio di dove non funziona, anche come stai usando moment (lo hai installato via npm, ecc.)?
omninonsense,

4
Con i momenti recenti (ho testato in 2.18.1) usare questo: moment.locale ("de"); var m = moment (). format ("LLL")
apadana,

1
apadana ha ragione: imposti la localizzazione con moment.locale('de')e crei un nuovo oggetto che rappresenta la data di adesso moment()(nota tra parentesi) e poi format('LLL'). La parentesi è importante. Testato in 2.20. Inoltre, ricorda di utilizzare moment-with-locale.jse, se necessario, modificare il nome in modo che sia moment.js. Django si rifiuta di caricare moment-with-locale.jsnel mio caso.
WesternGun

1
se questo non funziona, prova questo: moment().locale('de').format('LLL');
Anthony Kal,

Questo è coerente, ma non dimenticare di importare il locale che vuoi usare (cfr. La risposta di Agu Dondo).
Jeroen Crevits il

13

Dovresti aggiungere la moment.lang(navigator.language)tua sceneggiatura.

E devi anche aggiungere ogni locale in cui vuoi visualizzare: ad esempio per GB o FR, devi aggiungere quel formato locale nella libreria moment.js. Un esempio di tale formato è disponibile nella documentazione di momentjs. Se non aggiungi questo formato in moment.js, raccoglierebbe SEMPRE le impostazioni locali degli Stati Uniti in quanto è l'unico che attualmente vedo.


cosa succede se il loro browser è in 'en' e stanno leggendo in 'es' allora mostrerà solo l'ora in 'en'
Peter the Russian

12

fine 2017/2018: le risposte degli altri hanno troppo vecchio codice da modificare, quindi qui la mia risposta pulita alternativa:

con richiedono

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

con importazioni

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

Uso:

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

con fuso orario

* Richiede:

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

*importare:

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

utilizzare le zone:

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");

funzione per formattare la data

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

L'unica cosa che ha funzionato per me è stata l'importazione del momento del cambiamento in:import moment from 'moment/min/moment-with-locales';
leojnxs

@leojnxs sì, se si desidera includere tutte le impostazioni locali, ma è possibile lavorare solo con una o più impostazioni locali specifiche importando per ogni lingua
stackdave

6

PER UTENTI METEOR:

nel momento in cui le impostazioni locali non sono installate di default in meteor, si ottiene solo la locale 'en' con l'installazione predefinita.

Quindi usi il codice come mostrato correttamente nelle altre risposte:

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

ma rimarrà in inglese fino all'installazione delle impostazioni internazionali necessarie.

Esiste un modo semplice e pulito di aggiungere singoli locali per il momento in meteor (fornito da rzymek ).

Installa il pacchetto moment nel solito modo meteor con:

meteor add rzymek:moment

Quindi aggiungi le impostazioni locali di cui hai bisogno, ad esempio per l'italiano:

meteor add rzymek:moment-locale-it

O se vuoi davvero aggiungere tutte le localizzazioni disponibili (aggiunge circa 30k alla tua pagina):

meteor add rzymek:moment-locales

@AntonAL Meno male che mi hai inviato il tuo commento, ho appena notato che la domanda non era in realtà per meteor. Tuttavia, credo che la mia risposta sia piuttosto utile. Ho modificato la mia risposta per riflettere questo.
mwarren

Grazie! Aggiunto rzymek:moment-locale-dee ha funzionato :)
nooitaf il

4

Con il momento 2.18.1 e successivi:

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

2
Deve includere i file delle impostazioni locali, altrimenti non funzionerà.
zeleven,

2
Questo è già stato menzionato come non funzionante a meno che non sia stato importato anche il modulo locale del momento specifico associato.
Maniaque,

@Maniaque Non ho installato nulla di speciale solo npm install - salva il momento e funziona benissimo
fedeteka

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>

dimostrazione


3

Mentre stavo usando il webpack con gulp e gli amici ( questo generatore ha impostato tutto per me) ho dovuto apportare una modifica al file bower.json. Ho dovuto sovrascrivere l'importazione predefinita per il pacchetto moment e selezionare il file fornito in tutte le lingue:

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

Questo è il mio file completo 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"
  }
}

Dopo questo, devi ancora dichiarare / impostare la locale del momento prima di indicare una data, giusto?
NikZ

Certo :) Questo ti assicura solo di avere a disposizione le frasi tradotte in modo da poter passare a un'altra lingua (al volo)
GameScripting

3

Sto usando angular2-moment, ma l'utilizzo deve essere simile.

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

export class AppModule {

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

3

Cambia il momento js lingua secondo la versione

Versione: 2.8+

moment.locale ( 'ciao');

Versione: 2.5.1

moment.lang ( 'ciao');


3

funziona bene così: return moment(status.created_at).locale('es').fromNow();


2
Mentre questo codice può rispondere alla domanda, fornire un contesto aggiuntivo riguardo a come e / o perché risolve il problema migliorerebbe il valore a lungo termine della risposta.
Badacadabra,

3

Non sono sicuro di cosa sia cambiato, ma importare il file della lingua in questo modo ha funzionato per me

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

Notare lo src nell'istruzione import


2

per momentjs 2.12+ , procedi come segue:

moment.updateLocale('de');

Si noti inoltre che è necessario utilizzare moment.updateLocale(localeName, config)per modificare una locale esistente. moment.defineLocale(localeName, config)dovrebbe essere usato solo per creare una nuova locale.


2

Per me, ci sono alcune modifiche da apportare (ver. 2.20)

  1. Si imposta la localizzazione con moment.locale('de')e si crea un nuovo oggetto che rappresenta la data di adesso moment()(notare la parentesi) e quindi format('LLL'). La parentesi è importante.

Quindi ciò significa:

moment.locale('de');
var now = moment();
now.format('LLL');
  1. Inoltre, ricorda di usare moment-with-locale.js. Il file contiene tutte le informazioni sulla locale e ha dimensioni di file maggiori. Scarica la localecartella non è abbastanza. Se necessario, modifica il nome in modo che sia moment.js. Django si rifiuta di caricare moment-with-locale.jsnel mio caso.

EDIT: si è scoperto che non è necessario rinominare il file. Ho appena dimenticato di invocarlo nella pagina in modo che Django non pensi che sia necessario caricarlo, quindi è colpa mia.


2

Questo funziona semplicemente rilevando automaticamente la posizione dell'utente corrente.

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

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

1

Whoops slittamento della penna. Lo risolverei: var moment = function(x) { return moment(x).locale('de'); }gli altri modi non sembrano davvero rimanere attaccati / mantenuti in condizioni (per me).


0

Per coloro che lavorano in ambienti asincroni, momentsi comportano in modo imprevisto durante il caricamento di locali su richiesta.

Invece di

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

invertire l'ordine

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

Sembra che le impostazioni locali vengano caricate nella locale selezionata corrente, sovrascrivendo le informazioni sulla locale precedentemente impostate. Quindi cambiare prima le impostazioni locali, quindi caricare le informazioni sulle impostazioni locali non causa questo problema.


0

Dopo aver lottato, questo ha funzionato per me per 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>
  );
}

Puoi passare en, froppure es. Se si desidera un'altra lingua, è necessario importare la locale e aggiungerla all'array.

Se hai solo bisogno di supportare una lingua, è un po 'più semplice:

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>
  );
}
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.