Hi I’m having trouble to get the next button on the chapter page to scroll through the page. Can someone tel me if there’s anything wrong with my codes?
Thanks in advance!
chapter.html
<a class="button back" href="#/books/{{ currentBook }}">Back</a>
<div class="chapter" ng-repeat="chapter in book.chapters">
<p><span class="title"> {{ book.title }} </span> <span class="author"> {{ book.author}} </span></p>
<h2 class="chapter-title"> {{ chapter.title }} </h2>
<p ng-repeat="paragraph in chapter.paragraphs">{{ paragraph }}</p>
<a class="button next" href="#/books/{{ currentBookIndex }}/chapters/{{ nextChapterIndex }}">Next</a>
</div>
ChapterController
app.controller('ChapterController', ['$scope', 'books', '$routeParams', function($scope, books, $routeParams) {
books.success(function(data) {
$scope.book = data[$routeParams.bookId];
$scope.chapter = $scope.book.chapters[$routeParams.chapterId];
// If there no more chapters left, go back to the bookshelf view if($routeParams.chapterId >= $scope.book.chapters.length - 1) { $scope.nextChapterIndex = "#"; } });
// Using these properties to create the URLs in line 1 and line 11 of view/chapter.html $scope.currentBookIndex = parseInt($routeParams.bookId); $scope.currentChapterIndex = parseInt($routeParams.chapterId); $scope.nextChapterIndex = $scope.currentChapterIndex + 1; }]);