2013-07-10 29 views
19

Zastanawiam się nad przeniesieniem mojej strony do angularjs i chcę zacząć bardzo małą, przenosząc wszystkie moje statyczne teksty tekstowe po stronie serwera z django na kanciasty (w przeciwnym razie wystąpią problemy z składnią "{{}}").Internacjonalizacja za pomocą angularjs

Wydaje się, że najlepszym sposobem na to, że będzie jedną z dwóch opcji:

  1. Aby mieć wywołanie ajax, która zwraca JSON ze wszystkimi tekstami mojej stronie. Teksty będą przechowywane w zmiennej, która jest powiązana z moimi elementami HTML, więc kątowa zaktualizuje wszystko.
  2. Aby zapisać statyczny plik js ze słownikiem i uwzględnić go w moim kodzie HTML i powiązać słownik za pomocą angularjs.

Obie opcje pozwalają mi przełączać się między językami bez ponownego ładowania strony.

Który z nich jest lepszy? Ogólnie rzecz biorąc, czy jest to dobre podejście, czy jest bardziej poprawny sposób?

+0

Hi Uri, grałem z tej samej kwestii: włączenie .po pliki używane przez mojego app Django (back-end) w jego angularjs app (front-end). Czy możesz podać mi więcej informacji o tym, jak w końcu to osiągnąłeś? Oba podejścia działają dla mnie, chociaż wolałbym 1. ;-) Z góry dziękuję. – trinchet

+0

Poszedł z opcją # 2. To było o wiele prostsze i wykonało zadanie. – Uri

+0

Jak to zrobiłem http://stackoverflow.com/questions/19881590/how-you-deal-with-translation-multilanguage-webservices-in-django-rest-framewo/28078356#28078356 – thomaspaulb

Odpowiedz

9

Przede wszystkim, istnieje sposób, aby zmienić ograniczniki kątowe do innych symboli, jak tu odpowiedzi: Angular JS custom delimiter

2. opcja jest łatwiejsze. Dołączasz go raz i masz wszystkie tłumaczenia przy ładowaniu strony. Żadnych połączeń asynchronicznych, żadnych obietnic, miłych i łatwych.

A jednak pójdę z pierwszym. Usługi takie jak $translate naprawdę ułatwią Ci życie po opcji 1. Dodatkowo posiada wiele opcji ładowania i przechowywania załadowanych danych w LocalStorage i ciasteczkach, więc jest dużo miejsca na rozszerzenie i personalizację. Następnie możesz przetłumaczyć swoje treści za pomocą usługi, dyrektywy lub filtru $ translate.

I nie zapominaj, że 2 opcja wyłącza wszelkie opcje buforowanych żądań. Przy każdym żądaniu strony startowej serwer musi odczytać plik statyczny i umieścić go w html. Z pierwszą opcją przeglądarka użytkownika może przechowywać w pamięci podręcznej .json tak długo, jak chcesz.

4

AngularJS obsługuje il8n/L10n tylko dla filtrów walutowych, daty i liczb. Według this book:

Book-shot! (przepraszam za kamerą telefonu komórkowego niskiej jakości!)

powiedziałbym śledzić pierwsze podejście i załadować tłumaczenie dynamicznie. wiązałoby się to dużo pracy, ale nie ma innej drogi wokół

+0

OK, ale dlaczego jest połączenie JSON lepiej niż statyczne js? – Uri

+1

Myślę, że odpowiedź @package wyjaśnić, dlaczego JSON jest lepszy –

4

Wystarczy popatrzeć na angular-translate :)

Rozwiązuje oba scenariusze!

+0

link jest uszkodzony – danza

+0

jest http://angular-translate.github.io tymczasem. – PascalPrecht

+0

Istnieje również jlg-i18n, który rozwiązuje oba problemy, dodając interpolację i pluralizację. https://github.com/jlguenego/jlg-i18n – jlguenego

32

Wypróbowałem kilka różnych opcji, w tym Angular Translate, ale lubiłem Angular-gettext najlepsze jak dotąd.

Jedną z rzeczy, która ogromnie nam pomogła, jest to, że istnieje działająca wersja demo, w której znajduje się i18n TodoMVC, o nazwie angular-gettext-example.

Workflow jest prosta:

  1. Dodaj "przetłumaczyć" dyrektywy do szablonów
  2. Run grunt wyodrębnić.szablon (y) pula
  3. ręcznie wyłączyć .pot do dostawcy tłumaczeń lub DIY z poedit lub podobnego oprogramowania
  4. upuść tłumaczenie .po pliki z powrotem do projektu
  5. Run chrząknięcie kompilacji plików .po
  6. Ustaw domyślny język w swoim zasięgu
  7. Zobacz magię!

Jestem pewna, że ​​inne zamieszczone tu rozwiązania są również dobre, ale nie widziałem przykładu typu end-to-end, tak ładnie zorganizowanego, jak np. Kątowy-gettext-example.

Cheers, JD

+0

Naprawdę fajne narzędzie. To najbardziej pasuje do moich potrzeb. Dziękuję Ci! +1 – tmuecksch

+0

Zdecydowanie najbardziej płynna integracja. Dzięki! – Warwick

+0

Czy 'kąt-gettext' obsługuje konteksty? Są przydatne do radzenia sobie z homonimami. – cespon