I am creating a Card game and loading all cards from json file, as i found it easier. I am loading json in normal way in angular as follow
Script
app.controller('CardsController', function($scope, $http)
{
$http.get("Card.json").success(function(response){
$scope.Cards = response;
}).error(function(data, status, headers, config) {
console.log('error loading json');
});
$scope.random = function() {
return 0.5 - Math.random();
}
});
and i am iterating this json result in a div as follow
html
<div id="leftSideHolder">
<div ng-repeat="card in Cards | orderBy:random | limitTo:20">
<div style="position:absolute;">
<img src='images\{{card.image}}.{{card.imagetype1}}' width="154px" height="232px"/>
</div>
</div>
</div>
But i am getting a error from Angular. Error Link from Angular. No idea what is this error :( i think its array initializing issue.
I tried that solution as below
var cardList = null;
$http.get("data/Cards.json").success(function(response){
cardList = response;
}).error(function(data, status, headers, config) {
console.log('error loading json');
});
$scope.Cards = function() {
return cardList;
}
and in html i used Cards() as follow
<div ng-repeat="card in Cards() | orderBy:random | limitTo:20">
<div style="position:absolute;">
<img src='images\{{card.image}}.{{card.imagetype1}}' width="154px" height="232px"/>
</div>
</div>
But still same issue. I tried to remove random also in ng-repeat, and this error goes. But i need to randomize the array also.
My code is in below link as well.