web-dev-qa-db-fra.com

Prise en charge angulaire js pour la localisation

J'ai essayé de trouver de la documentation dans AngularJS pour prendre en charge plusieurs langues sans succès. La localisation est-elle prise en charge?

66
Chen Kinnrot

Jetez un oeil à angular-translate: https://github.com/angular-translate/angular-translate

pour tous les bricoleurs:

Vous pouvez trouver des fichiers localisés pour angular: here

Ces fichiers vous aideront avec les filtres angulaires intégrés: date , devise et nombre . Incroyable ... jusqu'à présent. 

Maintenant, vous voulez utiliser vos propres textes, il ne vous manque plus que la puissance de l'injection de dépendance angular.js . Créez un nouveau fichier du type: "myTexts_en_us.js" et utilisez $ Provide.value comme suit: 

$provide.value("myTexts", {firstText : "This is my localized text"});

Pour plus de détails:
http://jsfiddle.net/4tRBY/24/

Pour utiliser le monde réel, vous devriez ajouter un filtre: http://jsfiddle.net/4tRBY/41/

Conseils:

  • Assurez-vous d’insérer manuellement votre nouveau fichier de localisation dans votre code HTML, JS ou Server. (Le serveur est le meilleur choix ici!)
  • si vous incluez l'un des fichiers angular-local files , vous n'avez pas besoin de le configurer dans votre module d'application. (vous aurez automatiquement $ locale - voir le violon)
  • ajoutez une clé id à votre $ fourniture-value - et définissez la valeur sur un code de langue que vous utilisez dans votre fichier - cela sera utile pour les tests. 
72
Thomas Deutsch

Ce que vous recherchez, c'est $ locale .

Il y a en fait un exemple à propos de à mi-chemin de la page d'accueil d'angularjs aussi.

Un extrait de leur exemple:

function BeerCounter($scope, $locale) {
  $scope.beers = [0, 1, 2, 3, 4, 5, 6];
  if ($locale.id == 'en-us') {
    $scope.beerForms = {
      0: 'no beers',
      one: '{} beer',
      other: '{} beers'
    };
  } else {
    $scope.beerForms = {
      0: 'žiadne pivo',
      one: '{} pivo',
      few: '{} pivá',
      other: '{} pív'
    };
  }
}

Je ne suis pas sûr que ce soit un "standard" à proprement parler ... mais c'est un début. Si vous aviez beaucoup de localisation à faire, je pense que je créerais simplement un service à injecter dans mes contrôleurs ... quelque chose comme ce code pseudo-code:

app.service('myLocalization', ['$locale', function($locale) {
    var res = {
       'help' : { 
           'en-us': 'help',
           'es-mx': 'ayudame'
       },
       'beer' : {
            'en-us': 'beer',
            'es-mx': 'cerveza'
       }
    }

    return {
       getString: function(key) {
          return res[key][$locale.id];
       }
    }
});
17
Ben Lesh

J'ai créé un module spécialement à des fins de localisation - https://github.com/4vanger/angular-l10n Il prend en charge la localisation de messages, la substitution de paramètres, la modification des paramètres régionaux en vol et fournit plusieurs moyens pratiques de utilisez-le - filtres, directives, etc.

7
4vanger

Juste pour que les informations soient complètes - en commençant quelque part dans le flux AngularJS 1.4 -, une autre mise en œuvre de i18n sortira du noyau. Veuillez consulter https://github.com/angular/i18n

2
Yosh

Si vous recherchez un support i18n, vous pouvez vous reporter au projet ci-dessous, qui offre une fonctionnalité multilingue complète et est également facile à mettre en œuvre. Jetez un coup d'oeil au projet github

angularjs-localizationservice

0
kds

vous pouvez aussi vérifier ceci:

https://github.com/angular-ui/ui-utils/pull/173

la performance est meilleure que toutes les autres bibliothèques i18n disponibles pour angular pour le moment.

0
timothyswt