Integration of ember-i18n and moment via locale


#1

I’m using ember-i18n to switch between two languages on the fly, and it works great.

The only problem is that all the text related to moment.js and bootstrap-datepicker (which uses moment underwater) is not effected and the language there remains unchanged.

Is there an elegant manner to integrate these two so that the language switching is propogated to moment also?

The datepicker calendar should switch for weekdays, months etc and days since also.


#2

We could expose a service in ember-moment which all helpers will observe changes to the service’s locale. Feel free to open an issue for tracking: https://github.com/stefanpenner/ember-moment/issues

As for bootstrap-datepicker, you’ll need to rerender it on locale change.

Slightly on topic, ember-intl supports date/time formatting and has the behavior you’re after baked into the library. It does not use moment, it uses the native Intl API that most modern browsers ship with now.


#3

I did manage to figure out how to integrate bootstrap-datepicker with the current language. In my template file I have:

{{bootstrap-datepicker-inline
    id="datepicker"
    ...
    language=language
    ...
}}

In the controller, I have:

export default Ember.ArrayController.extend({
    ...
    language: Ember.computed.alias('i18n.locale'),
    ...
});

which works great.


#4

In my model I define an extra property:

birthdate_i18n: function() {
    var birthdate = this.get('birthdate');
    var lang = this.get('i18n.locale');
    moment.locale(lang).format('LLL');
    return moment(birthdate);
}.property('birthdate', 'i18n.locale'),