Angular Moment - Изменить локаль с настраиваемым объектом локали

Question

У меня возникли проблемы с настройкой изменения локали в моем приложении с угловыми углами. Я использую Angular Moment и Moment.js

Во-первых, я устанавливаю локаль английский в моем angular.module.config и сразу же установив относительный объект времени, как мне нужно:

  moment.locale('en', { 
       relativeTime: { 
        future: "In %s", 
        past: "%s ago", 
        s: "<1 minute", 
        m: "1 minute", 
        mm: "%d minutes", 
        h: "1 hour", 
        hh: "%d hours", 
        d: "24 hours", 
        dd: "%d days", 
        M: "1 month", 
        MM: "%d months", 
        y: "1 year", 
        yy: "%d years" 
       } 
      }); 

это работает как и предполагалось,

Теперь у меня есть равный объект, но для немецкого. Я не знаю, куда его отбрасывать, потому что, если я его сброшу в конфигурации, он переопределит английский вариант.

Тогда у меня есть выпадающее меню в меню заголовка с EN и DE (я уже получаю его в нижнем регистре для переводов) в моем контроллере, и я не могу связать amMoment.changeLocale('de');, чтобы изменить момент к немецкому, и я не могу, кажется, обновить его мгновенно.

Как я могу это достичь?

Answer 1

Вы можете настроить relativeTime для нескольких локалей подряд без переопределения предыдущей конфигурации.

Вы можете использовать ng-change, чтобы привязать выпадающее меню к функции, которая вызывает amMoment.changeLocale для выбранной локали.

Учтите, что вам нужно импортировать moment-with-locales или все требуемые файлы локали, чтобы использовать момент с нестандартными локалями.

Если я понял, что вы хотите достичь, здесь есть рабочий пример:

angular.module('MyApp',['angularMoment']) 
 
.run(function(){ 
 
    moment.updateLocale('en', { 
 
    relativeTime: { 
 
     future: "In %s", 
 
     past: "%s ago", 
 
     s: "<1 minute", 
 
     m: "1 minute", 
 
     mm: "%d minutes", 
 
     h: "1 hour", 
 
     hh: "%d hours", 
 
     d: "24 hours", 
 
     dd: "%d days", 
 
     M: "1 month", 
 
     MM: "%d months", 
 
     y: "1 year", 
 
     yy: "%d years" 
 
    } 
 
    }); 
 
    moment.updateLocale('de', { 
 
    relativeTime: { 
 
     future : 'in %s', 
 
     past : 'vor %s', 
 
     s : '<ein Minute', 
 
     m : 'ein Minute', 
 
     mm : '%d Minuten' 
 
    } 
 
    }); 
 
}) 
 
.controller('AppCtrl', function($scope, moment, amMoment) { 
 
    $scope.last_update = moment().valueOf(); 
 
    $scope.lang = 'en'; 
 
    
 
    $scope.changeLang = function(){ 
 
    amMoment.changeLocale($scope.lang); 
 
    }; 
 
    $scope.changeLang(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment-with-locales.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/0.10.3/angular-moment.min.js"></script> 
 

 
<div ng-app="MyApp" ng-controller="AppCtrl"> 
 
    {{last_update|amDateFormat:'dddd, MMMM Do YYYY, HH:mm:ss a'}} 
 
    <br/> 
 
    <span am-time-ago="last_update"></span> 
 
    <br/> 
 
    
 
    <select name="singleSelect" ng-model="lang" ng-change="changeLang()"> 
 
    <option value="en">EN</option> 
 
    <option value="de">DE</option> 
 
    </select> 
 
    
 
    {{lang}} 
 
    
 
</div>