I am attempting to showcase information from a JSON file that is structured like this:
[
{
"category":"category1",
"link":"category1",
"expand":false,
"keyword":"category1, category1 online, category1 something"
},
{
"category":"category2",
"link":"category2",
"expand":false,
"keyword":"category2, category2 online, category2 something"
}
]
In addition, I am implementing $routeProvider in my controller:
var myApp = angular.module('myApp', [
'ngRoute',
'MyControllers'
]);
myApp.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/:itemName', {templateUrl: function(param){
return'partials/'+ param.itemName +'.html';
}, controller: 'ContentCtrl'});
$routeProvider.otherwise({redirectTo: '/category1'});
}]);
var MyControllers = angular.module('MyControllers', ['ngAnimate']);
MyControllers.controller('ContentCtrl', ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams) {
$http.get('js/data.json').success(function(data){
$scope.meta = data;
$scope.whichItem = $routeParams.itemName.indexOf()+1;
});
}]);
Finally, here is a template:
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<section ng-view>
<h1>{{meta[whichItem].h1}}</h1>
</section>
</body>
</html>
The issue I am facing is that the parameter $whichItem consistently returns a value of 0. It does not update when I change the route to /category2, for instance, and continues to display the same keywords from the JSON data. What could be causing this problem?