As You can see in my HTML I want to take my Data according to my current locale, and i have custom translation file enTranslation, which is given.
PROBLEM : I am not able to see the values on browser page, when i am using {{ translations[key] }} OR {{ translation.key }}
Please HELP me understand what is needed to be done to make this work.
I have 3 files in js Directory, Given Code Below:
1. enTranslations.js
2. prax_controller.js
3. angular_1.4.2.min.js
And My HTML file
<!DOCTYPE html>
<html>
<head>
<script src="js/angular_1.4.2.min.js"></script>
<script src="js/prax_controller.js"></script>
<script src="js/enTranslations.js"></script>
<meta charset="UTF-8">
<title>Prax Local</title>
</head>
<body ng-app="prxApp" ng-controller="prxController">
<div>
List
<ul class="d1" ng-repeat="(key, value) in eventHistories">
<li class="d1k">
<!-- {{ translations.key }}: {{ value }}% -->
{{ translations[key] }} : {{ value }}%
</li>
</ul>
</div>
</body>
</html>
1. enTranslations.js
var translations = {
"Device Status":'Device Status',
"Device Temperature":'Device Temperature',
"Device Network":'Device Network',
"Wifi hotspot":'Wifi hotspot',
"Memory Usage":'Memory Usage',
"Data Usage":'Data Usage',
"Application":'Application',
"Security":'Security',
"Activity":'Activity',
"SIM Info":'SIM Info',
"Motion Info":'Motion Info'
};
2. prax_controller.js
var prxApp = angular.module('prxApp', []);
prxApp.controller('prxController', ['$scope', function($scope) {
$scope.init = function()
{
$scope.eventHistories = {
"Device Status":0,
"Device Temperature":0,
"Device Network":0,
"Wifi hotspot":0,
"Memory Usage":0,
"Data Usage":0,
"Application":0,
"Security":0,
"Activity":0,
"SIM Info":0,
"Motion Info":0
};
};
$scope.init();
}]);
Aucun commentaire:
Enregistrer un commentaire