Como altero o idioma do moment.js?

196

Estou tentando alterar o idioma da data que está sendo definida pelo moment.js. O padrão é o inglês, mas eu quero definir o idioma alemão. Isto é o que eu tentei:

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

Está dando NaN.

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

Isso nem está reagindo.

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

Sem alterações: isso ainda está produzindo um resultado em inglês.

Como isso é possível?

doniyor
fonte

Respostas:

303

Você precisa de moment.lang ( AVISO : lang()está obsoleto desde o momento 2.8.0, use em locale()vez disso):

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

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


A partir da v2.8.1, moment.locale('de')define a localização, mas não retorna a moment. Alguns exemplos:

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'

Em suma, chamar localeo global momentdefine o código do idioma para todas as momentinstâncias futuras , mas não retorna uma instância de moment. Chamar localeuma instância, define-a para essa instância E retorna essa instância.

Além disso, como Shiv disse nos comentários, use "moment-with-locales.min.js" e não "moment.min.js", caso contrário não funcionará.

Kalley
fonte
1
Nos documentos, você pode criar instâncias específicas do idioma no momento, fazendo isso. Se você formatar primeiro, o idioma não será processado. Como alternativa, você pode fazer algo como var deMoment = moment(); deMoment.lang('de')e reutilizar em deMomentvez de um momento ao longo do seu script.
22413 kalley
32
Se você usar "moment.min.js", não funcionará; você precisa "moment-with-locales.min.js"
Shiv
2
atualização: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
você precisa importar a linguagem queria outro sábio este trabalho não vai: import moment from 'moment'; import localization from 'moment/locale/de' moment().locale("de", localization).format('LLL')
Azul Bot
2
importar momento de 'momento / min / momento com localidades';
Leojnxs 29/10/19
166

Eu tive que importar também o idioma:

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

Então use momentos como você normalmente faria

alert(moment(date).fromNow())
Agu Dondo
fonte
15
Sua resposta mais útil do que outros, porque você mencionou sobreimport 'moment/locale/es'
Artem Solovev
4
Sim, esta é a resposta correta ... obrigado, eu estava puxando meu cabelo para me perguntar por que não estava funcionando. Mas essa é realmente uma necessidade de importar para qualquer tipo de idioma que possa ser usado. Tem que haver uma maneira melhor.
Maniaque 28/09
1
Obrigado por explicar a importação de localidade específica.
Fernando León
de acordo com a documentação, se alguém quiser que todos os códigos de idioma sejam incluídos, ele poderá usá-lo require("moment/min/locales.min");ou importimport 'moment/min/locales.min'
kamran
Obrigado, exatamente o que eu preciso
Davide P.
55

Método mais rápido: instalar com o Bower

Acabei de instalar o momento com o bower e vinculei de.jscomo recurso javascript no meu projeto html.

bower install moment --save

Você também pode baixar manualmente o moment.jse de.js.

Vincule 'de.js' no seu projeto

Vincular o de.jsarquivo no meu projeto principal alterou automaticamente o código do idioma para todos os acessos à classe moment e seus métodos.

Não haverá mais necessidade de fazer um moment.locale("de").ou moment.lang("de"). no código fonte.

Basta vincular o código de idioma desejado da seguinte maneira:

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

Ou você pode vincular as bibliotecas sem o bower_componentscaminho, se você baixou o moment.js no estilo dos anos 90, com o botão direito, o que ainda funciona bem na maioria dos cenários.

Steve K
fonte
2
Essa deve ser a resposta correta. Basta ligar o local desejado com <script src="/bower_components/moment/locale/de.js"></script>. Funciona para mim agora.
mles
8
"Não haverá mais necessidade de fazer um moment.locale (" de ") ou moment.lang (" de "). No código fonte.". Eu acho que isso ainda é útil para aplicativos dinâmicos que alteram o local. Como você pode, teoricamente, alterar a localidade em meu aplicativo através de um menu suspenso lang / país em meu aplicativo angular e momento deve alterar os formatos de forma dinâmica que eu faria Eu acho que com moment.locale ($ lang)
armyofda12mnkeys
Claro, mas você ainda precisa carregar o arquivo javascript no seu index.html nos meus testes. Ainda é um problema em maio de 2017, talvez o momento deva incluir isso em seus documentos.
26417 Steve K
37

Com o momentjs 2.8+, faça o seguinte:

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

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

Nashenas
fonte
Ele deve trabalhar; você pode fornecer um exemplo de onde isso não funciona, e também como você está usando o momento (você o instalou via npm, etc)?
Omninonsense
4
Com momentos recentes (testei em 2.18.1), use: moment.locale ("de"); var m = momento (). formato ("LLL")
apadana
1
apadana está certo: você define o código de idioma com moment.locale('de')e cria um novo objeto que representa a data de agora moment()(observe o parêntese) e depois format('LLL'). O parêntese é importante. Testado em 2.20. Além disso, lembre-se de usar moment-with-locale.jse, se necessário, altere o nome para ser moment.js. O Django simplesmente se recusa a carregar moment-with-locale.jsno meu caso.
WesternGun
1
se este não estiver funcionando, tente este: moment().locale('de').format('LLL');
Anthony Kal
Este é co-correto, mas não esqueça de importar o local que você deseja usar (cf. resposta de Agu Dondo).
Jeroen Crevits
13

Você precisaria adicionar moment.lang(navigator.language)seu script.

E também deve adicionar a localidade de cada país em que você deseja exibir: por exemplo, para GB ou FR, é necessário adicionar esse formato de localidade na biblioteca moment.js. Um exemplo desse formato está disponível na documentação do momentjs. Se você não adicionar esse formato no momento.js, ele sempre escolherá a localidade dos EUA, pois é a única que eu vejo atualmente.

Smart Coder
fonte
E se o seu navegador está em 'en' e eles estão lendo em 'es', então ele só irá mostrar o tempo em 'en'
Pedro, o russo
12

final de 2017/2018: as respostas dos outros têm muito código antigo para editar, então aqui minha resposta alternativa limpa:

com exigir

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

com importações

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

Usar:

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

com fuso horário

* requer:

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

*importar:

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

use zonas:

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

função para formatar a 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
  }  
};
stackdave
fonte
A única coisa que funcionou para mim foi a mudança do momento para:import moment from 'moment/min/moment-with-locales';
leojnxs
@leojnxs sim, se você deseja incluir todos os locais, mas é possível trabalhar apenas com um ou mais locais específicos fazendo uma importação para cada idioma
stackdave
6

PARA USUÁRIOS DO METEORRO:

No momento em que as localidades não são instaladas por padrão no meteoro, você só obtém a localidade 'en' com a instalação padrão.

Então você usa o código como mostrado corretamente em outras respostas:

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

mas permanecerá em inglês até você instalar o código de idioma necessário.

Existe uma maneira agradável e limpa de adicionar localidades individuais para momento no meteoro (fornecido por rzymek ).

Instale o pacote momentâneo da maneira usual de meteoros com:

meteor add rzymek:moment

Em seguida, basta adicionar os locais necessários, por exemplo, para italiano:

meteor add rzymek:moment-locale-it

Ou se você realmente deseja adicionar todos os códigos de idioma disponíveis (adiciona cerca de 30 mil à sua página):

meteor add rzymek:moment-locales
mwarren
fonte
@AntonAL Ainda bem que você me enviou seu comentário, acabei de notar que a pergunta não era realmente para meteoros. No entanto, minha resposta é bastante útil, eu acho. Eu editei minha resposta para refletir isso.
Mwarren 16/03/19
Obrigado! Adicionado rzymek:moment-locale-dee funcionou :)
nooitaf
4

Com o momento 2.18.1 e seguintes:

  moment.locale("de");
  var m = moment().format("LLL")
apadana
fonte
2
Deve incluir os arquivos de localidade, caso contrário não funcionará.
Zeleven
2
Isso já foi mencionado como não funcionando, a menos que o módulo de localidade do momento específico associado também tenha sido importado.
Maniaque 28/09
@Maniaque eu não instalar nada de especial apenas npm instalar momento --save e funciona bem
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>

Demo

Ram Pukar
fonte
3

Como eu estava usando o webpack com gulp e amigos ( esse gerador configurou tudo para mim), tive que fazer uma alteração no arquivo bower.json. Eu tive que substituir a importação padrão para o pacote moment e selecionar o arquivo que acompanha todos os idiomas:

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

Este é o meu arquivo bower.json completo:

{
  "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"
  }
}
GameScripting
fonte
Depois disso, você ainda precisa declarar / definir o local do momento antes de emitir uma data, certo?
NikZ
É claro :) Isso só garante que você tenha as frases traduzidas disponíveis para que você possa mudar para outro idioma (on the fly)
GameScripting
3

Estou usando o angular2-moment, mas o uso deve ser semelhante.

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

export class AppModule {

  constructor() {
    moment.locale('ru');
  }
}
Dmitry
fonte
3

Alterar o idioma do momento js conforme a versão

Versão: 2.8+

moment.locale ('oi');

Versão: 2.5.1

moment.lang ('oi');

Anil Nankar
fonte
3

funciona bem assim: return moment(status.created_at).locale('es').fromNow();

Claudio Scheuermann
fonte
2
Embora esse código possa responder à pergunta, fornecer um contexto adicional sobre como e / ou por que resolve o problema melhoraria o valor a longo prazo da resposta.
Badacadabra 4/06
3

Não sei o que mudou, mas importar o arquivo de idioma como este funcionou para mim

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

Observe o src na declaração de importação

Taha
fonte
2

para momentjs 2.12+ , faça o seguinte:

moment.updateLocale('de');

Observe também que você deve usar moment.updateLocale(localeName, config)para alterar um código de idioma existente. moment.defineLocale(localeName, config)deve ser usado apenas para criar um novo código de idioma.

Francisco Costa
fonte
2

Para mim, há algumas mudanças a serem feitas (versão 2.20)

  1. Você define o código de idioma com moment.locale('de')e cria um novo objeto que representa a data de agora até moment()(observe o parêntese) e depois format('LLL'). O parêntese é importante.

Então, isso significa:

moment.locale('de');
var now = moment();
now.format('LLL');
  1. Além disso, lembre-se de usar moment-with-locale.js. O arquivo contém todas as informações de localidade e tem um tamanho de arquivo maior. Baixar a localepasta não é suficiente. Se necessário, mude o nome para ser moment.js. Django apenas se recusa a carregarmoment-with-locale.js no meu caso.

EDIT: Acabou que não é necessário renomear o arquivo. Eu apenas esqueci de invocá-lo na página para que o Django não pense que é necessário carregá-lo, então a culpa é minha.

WesternGun
fonte
2

Este funciona apenas detectando automaticamente a localização atual do usuário.

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

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

Gritos deslizam da caneta. Eu resolveria o seguinte: var moment = function(x) { return moment(x).locale('de'); }as outras maneiras não parecem realmente manter-se em condições (para mim).

Rob Jens
fonte
0

Para quem trabalha em ambientes assíncronos, momentcomporta-se inesperadamente ao carregar localidades sob demanda.

Ao invés de

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

reverter a ordem

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

Parece que os códigos de idioma estão carregados no código de idioma selecionado atual, substituindo qualquer informação de código de idioma definida anteriormente. Portanto, alternar o código do idioma primeiro e carregar as informações do código do idioma não causa esse problema.

Yanick Rochon
fonte
0

Depois de lutar, isso funcionou para mim na 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>
  );
}

Você pode passar en, froues . Se você quisesse outro idioma, teria que importar o código do idioma e adicioná-lo à matriz.

Se você precisa apenas suportar um idioma, é um pouco mais simples:

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>
  );
}
Alan P.
fonte