Internationalisation avec angularjs
je pense à déplacer mon site vers angularjs, et je veux commencer très petit, en déplaçant tout mon serveur statique-côté texte en clair de Django à angular (sinon il y aura des problèmes de syntaxe avec le' {}}').
Il semble que la meilleure façon de le faire sera l'une des deux options:
- pour avoir un appel ajax qui renvoie un JSON avec tous les textes de mon site. Les textes seront stockés dans une variable qui est liée à mon Les éléments HTML si anguleux vont tout mettre à jour.
- pour stocker un fichier JS statique avec le dictionnaire et l'inclure dans mon HTML et lier le dictionnaire avec angularjs.
les deux options me permettront de passer d'une langue à l'autre sans recharger la page.
lequel est le meilleur? En général, est-ce une bonne approche ou est-il un plus bonne façon?
4 réponses
tout d'abord, il y a un moyen de changer les délimiteurs d'angular à d'autres symboles comme répondu ici: délimiteur de coutume D'Angular JS 151930920"
le 2. option est plus facile. Vous l'incluez une fois et vous avez toutes les traductions sur le chargement de page. Pas d'appels asynchrones, pas de promesses, agréable et facile.
et j'ai choisi le premier. Des Services comme $translate faciliteraient vraiment votre vie en suivant l'option 1. Majoré Il dispose de nombreuses options pour le chargement et le stockage des données chargées dans LocalStorage et les cookies, Il ya donc beaucoup d'espace pour l'extension et la personnalisation. Vous pouvez ensuite traduire votre contenu avec $translate service, directive ou filter.
et n'oubliez pas que 2 options désactivent toutes les options des requêtes mises en cache. Pour chaque requête à votre page de départ, le serveur doit lire le fichier statique et l'inclure dans le html. Avec la première option, le navigateur de l'utilisateur peut mettre en cache .json aussi longtemps que vous comme.
j'ai essayé quelques options différentes, y compris la traduction angulaire, mais j'ai aimé Angular-gettext le meilleur jusqu'à présent.
une chose qui a énormément aidé est qu'il ya une démo de travail pour elle où ils i18n TodoMVC, appelé angular-gettext-exemple .
le flux de travail est simple:
- ajouter la directive" traduire "à vos templates
- Run grunt à extraire .pot de modèle(s)
- Main de la .pot à votre fournisseur de traduction ou de bricolage avec POEdit ou un logiciel similaire
- Drop the .po des fichiers de traduction dans le projet
- Exécuter grunt pour compiler le .les fichiers po
- définir la langue par défaut dans votre champ d'application
- regardez la magie!
je suis sûr que les autres solutions posté ici sont bons aussi, mais je n'ai pas vu un bout à l'exemple tellement bien organisé que angulaires-gettext-exemple.
santé, JD
AngularJS prend en charge il8n/L10n pour filtres monnaie, date et numéros seulement. Selon ce livre :
(désolé pour la mauvaise qualité! téléphone cellulaire)
je dirais de suivre la première approche et de charger la traduction dynamiquement. Cela impliquerait beaucoup de travail, mais il n'y a pas d'autre solution
regarder angular-translate :)
il résout les deux scénarios!