The i18n stand for Internationalization.
This is the process to developing a product for global languages.
The L10n stand for Localization. This is
the process to developing a product for particular cultural or languages.
How does Angular support i18n/l10n?
In Angularjs,
The i18n and L10n are supporting to filters to the date, number and currency.
The en-US, en-AU etc. are all valid locale Ids that contain the both language code and country code(for example en is language code and US is a country code.).
<!doctype
html>
<head>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.1/angular.min.js"></script>
<script src="//rawgithub.com/angular-translate/bower-angular-translate/master/angular-translate.min.js"></script>
<script>
var app = angular.module('app', ['pascalprecht.translate']);
app.config(function($translateProvider)
{
$translateProvider.translations('en', {
title: 'clicked
on english language',
name: 'this.name',
button_lan_en: 'english',
button_lan_de: 'german'
});
$translateProvider.translations('de', {
title: 'clicked
on deutsch language',
name: 'this.name',
button_lan_en: 'english',
button_lan_de: 'deutsch'
});
$translateProvider.preferredLanguage('en');
});
app.controller('i18ncontroller', function($scope, $translate)
{
$scope.changeCurrentLang = function(key) {
$translate.use(key);
};
});
</script>
</head>
<body
ng-app="app">
<div class="row">
<h1>i18n and L10n angularjs language
translation </h1>
<div>
<div>
<h2 translate="title"></h2>
</div>
<div ng-controller="i18ncontroller">
<button ng-click="changeCurrentLang('en')" translate="button_lan_en">English language</button>
<button ng-click="changeCurrentLang('de')" translate="button_lan_de">German language</button>
</div>
</div>
</div>
</body>
</html>
