Y.Hewa Y.Hewa - 1 month ago 9
AngularJS Question

Angularjs switching divs with next and previous with json content

I have made a plunker of my code so far. The problem is i want each question to be in the div and by clicking the next i want to go to the next question. Also i have a set of images for each question which i would want to change everytime the user clicks to go to the next question. Right now it doesnt seem to be showing all the questions just the last one which is question number 10. Please help me...

var app = angular.module('myApp', []);
app.controller('ListCtrl', ['$scope', '$http', function($scope, $http) {
$scope.questions = []
$http.get('results.json').success(function(data) {
angular.forEach(data, function(question) {
$scope.questions.push(question);
})
});
$scope.index = 1;
}]);


I have used the code suggested here : angularjs Click button to show next / previous div

Here is my plunker : http://plnkr.co/edit/DqNRnc8xYZn73vdkWjaG

Answer

You have 2 issues here:

  1. Change the ng-class expression to: {'div-hide': index != $index + 1}
  2. The ng-click has a wrong spacing around the word "index" (e.g ng-click="index=i ndex)

Fixing these two seems to work..