Internationalization with angularjs

Question

I\'m thinking of moving my site to angularjs, and I want to start very small, by moving all my static server-side plain-text templating from django to angular (otherwise there w

Answer 1

I tried out a few different options, including Angular Translate, but I liked Angular-gettext the best so far.

One thing that helped tremendously is that there's a working demo for it where they i18n TodoMVC, called angular-gettext-example.

The workflow is simple:

1. Add the "translate" directive to your templates
2. Run grunt to extract .pot template(s)
3. Hand off the .pot to your translation vendor or DIY with POEdit or similar software
4. Drop the .po translation files back into your project
5. Run grunt to compile the .po files
6. Set the default language in your scope
7. Watch the magic!

I'm sure the other solutions posted here are good as well but I haven't seen an end-to-end example so nicely organized as angular-gettext-example.

Cheers, JD

Answer 2

Have a look at angular-translate :)

It solves both scenarios!

Answer 3

AngularJS supports il8n/L10n for currency, date and numbers filters only. According to this book:

(sorry for the low quality! cell phone camera)

I would say follow the first approach and load the translation dynamically. It would involve a lot of work but there's no other way around

Answer 4

First of all, there is a way to change angular's delimiters to other symbols as answered here: Angular JS custom delimiter

The 2. option is easier. You include it once and you have all translations on page load. No async calls, no promises, nice and easy.

And yet i'd go with the first one. Services like $translate would really make your life easier following option 1. Plus it has many options for loading and storing loaded data in LocalStorage and cookies, so there's plenty of space for extension and customization. You can then translate your content with $translate service, directive or filter.

And don't forget that 2 option disables any options of cached requests. On each request to your start page the server has to read static file and include it in the html. With first option the user's browser can cache .json for as long as you like.