Skip to content

Instantly share code, notes, and snippets.

@mzabriskie

mzabriskie/README.md

Last active August 29, 2015 14:02
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save mzabriskie/6bb93cb556e1264195a9 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save mzabriskie/6bb93cb556e1264195a9 to your computer and use it in GitHub Desktop.
Download ZIP
angular-translate - Issue with `useStaticFilesLoader` along with `registerAvailableLanguageKeys`
Raw
README.md

Setup

  1. Copy index.html and locale-en.json to the same directory
  2. From this directory run the bash commands below
  3. Open http://127.0.0.1:8080
bower install angular
bower install angular-translate
bower install angular-translate-loader-static-files
npm install http-server
http-server

Reproduce

When running the code in the browser two requests will be made for static translation files:

  1. locale-en-US.json
  2. locale-en.json

In this case locale-en-US.json results in a 404 since it does not exist on the server. I am using registerAvailableLanguageKeys so I would expect that the first request would not be made. Since this should be aliasing en-US to en.

Now comment out line 22 in index.html (fallbackLanguage) and reload the page. This time only a single request is made for static translation files:

  1. locale-en.json

This solves the problem of the 404 however I now have no fallback language, so if I change preferredLanguage to be de no translation happens and my message ID (HELLO) is shown instead.

Raw
index.html
<!doctype html>
<html ng-app="app">
<meta charset="utf-8"/>
<h1 ng-controller="ExampleCtrl">{{ 'HELLO' | translate }}</h1>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-translate/angular-translate.js"></script>
<script src="bower_components/angular-translate-loader-static-files/angular-translate-loader-static-files.js"></script>
<script>
angular.module('app', ['pascalprecht.translate'])
.config(function ($translateProvider) {
$translateProvider
.useStaticFilesLoader({
prefix: 'locale-',
suffix: '.json'
})
.registerAvailableLanguageKeys(['en'], {
'en-*': 'en'
})
.preferredLanguage('en-US')
.fallbackLanguage('en');
})
.controller('ExampleCtrl', function () {});
</script>
Raw
locale-en.json
{
"HELLO": "Hello"
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment