Internationalization with angularjs
angularjs, internationalization, templating
Solution
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.
Problem
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 will be syntax trouble with the '{{}}'). It seems that the best way to do that will be one of two options: - To have an ajax call that returns a JSON with all the texts of my site. The texts will be stored in a variable which is binded to my HTML elements so angular will update everything. - To store a static js file with the dictionary and include it in my HTML and bind the dictionary with angularjs. Both options will allow me to switch between languages without reloading the page. Which one is better? In general, is this a good approach or is there a more correct way?