<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script data-require="angular.js@1.3.8" data-semver="1.3.8" src="https://code.angularjs.org/1.3.8/angular.js"></script>
<script data-require="angular-translate@*" data-semver="2.5.0" src="https://cdn.rawgit.com/angular-translate/bower-angular-translate/2.5.0/angular-translate.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<div ng-controller="translateController">
<h1>Demo for angularJS translator</h1>
<div>
<button ng-click="changeLanguage('en')">English</button>
<button ng-click="changeLanguage('sp')">Spanish</button>
</div>
<h2>{{'language' | translate}}</h2>
Hello!!!
<p>{{'greeting' | translate}}</p>
</div>
</body>
</html>
var app = angular.module("myApp",['pascalprecht.translate']);
app.config(["$translateProvider", function($translateProvider){
var en_translations = {
"language" : "Selected Language English",
"greeting" : "Welcome Dinesh"
}
var sp_translations = {
"language" : "Selected Language Spanish",
"greeting" : "Bienvenida Dinesh"
}
$translateProvider.translations('en',en_translations);
$translateProvider.translations('sp',sp_translations);
$translateProvider.preferredLanguage('en');
}]);
app.controller("translateController" ,["$scope","$translate",function($scope,$translate){
$scope.changeLanguage = function(lang){
$translate.use(lang);
}
}]);