Les crashs dev d'un passionné

Dans mon application j'utilise Angular Translate et j'avais besoin de lancer de la traduction dans un contrôleur. Cependant j'affichais les clés de traduction et non leurs valeurs. Il y avait donc un problème de chargement de traduction. En effet la méthode que je vais décrire est faite pour être asynchrone.

La solution est d'attendre la réponse du refresh() via une promesse then(). Refresh() met à jour les tables de traduction, il est utile quand on désire charger plusieurs fichiers de traduction via $translatePartialLoader

function MyCtrl ($translatePartialLoader, $translate) {
  var vm = this;
  $translatePartialLoader.addPart('../components/mycomponent');
  $translate.refresh().then( 
    ...
    vm.month = $translate.instant('SEARCH_MONTH')
  );
  ...
});

Et dans le fichier run.js on configure notre module de traduction

angular
    .module('app', ['pascalprecht.translate'])
    .config(function ($stateProvider, $urlRouterProvider, $translateProvider, $translatePartialLoaderProvider) {
      $urlRouterProvider.otherwise("/");

      $stateProvider
          .state('home', {
            url: '/home',
            templateUrl: 'views/home.html',
            controller: 'MainCtrl',
            controllerAs: 'home'
          });

      $translatePartialLoaderProvider.addPart('common');
      $translateProvider.useLoader('$translatePartialLoader', {
          urlTemplate: 'i18n/{part}/locale-{lang}.json'
      });
      $translateProvider.preferredLanguage('en');
    });

})();