Проблема с событием пагинации при вызове themoviedb json с Angular - PullRequest
Новая
       11

Проблема с событием пагинации при вызове themoviedb json с Angular

0 голосов
/ 20 сентября 2018

Я получаю ответ ajax с API themoviedb.Я хочу вызывать свою функцию, которая получает ответ API с другим номером страницы при каждом вызове функции.

Мне удалось получить данные, и я могу записать правильный URL-адрес в функцию успеха.Однако вызываемый json не обновляется новым номером страницы, он всегда первый, который вызывается при загрузке страницы.Мне не хватает некоторых функций для правильной повторной инициализации вызова ajax с обновленным URL-адресом?

Вот контроллер: 

angular.module('MovieApp', [])
    .controller("MovieAppCtrl",
        [
            '$http', '$scope',
            function($http, $scope) {
                $scope.MovieData = [];
                $scope.Search = null;
                $scope.Key = '01b2f34add226a588438bf6e49b953d5';
                $scope.GetMoviesData = function(number) {
                    try {
                        $http({
                            url: 'https://api.themoviedb.org/3/movie/popular?api_key='+$scope.Key+'&page="'+number+'"',
                            method: "GET",
                        }).then(
                            function(payload) {
                                $scope.MovieData = payload.data;
                                console.log($scope.MovieData);
                                console.log('https://api.themoviedb.org/3/movie/popular?api_key='+$scope.Key+'&page='+number+'');
                            },
                            function(){
                                alert("Something is wrong. Please try again.");
                            });
                    } catch (error) {
                        alert("Exception occured while fetching movie data.");
                    }
                }
            }
        ]);
    angular.element(function() {
        angular.bootstrap(document, ['MovieApp']);
    });

Здесь число представляет номер страницы, добавленный к пути URL:например: https://api.themoviedb.org/3/movie/popular?api_key=01b2f34add226a588438bf6e49b953d5&page=2

разметка: 

<div ng-controller='MovieAppCtrl'>

<div class="album">
            <div class="container">
                <div class="clearfix row">
                  <a ng-repeat="movie in MovieData.results | limitTo:100" class="video-list col-md-4" target="_blank" ng-href="">
                    <div class="card mb-4 box-shadow">
                        <img ng-src="https://image.tmdb.org/t/p/w185_and_h278_bestv2/{{movie.poster_path}}" title="{{movie.title}}" alt="{{movie.title}}" class="card-img-top">
                        <div class="card-body">
                          <h5 class="">{{movie.title}}</h5>
                          <span>Rating: {{movie.vote_average}}</span><br>
                          <span>Votes: {{movie.vote_count}}</span>
                        </div>
                    </div>
                  </a>
                </div>
                <div class="pagination check-element m-show-hide ng-hide" ng-show="checked">
                    <p class="left">You're on page: 1 of 5 <span class="total_results">(100 resultat)</span></p>
                    <p class="right pagination">
                        <span ng-click="GetMoviesData(1)">
                            <span class="page1">1</span>
                        </span>
                        <span ng-click="GetMoviesData(2)">
                            <span class="page2">2</span>
                        </span>
                        <span ng-click="GetMoviesData(3)">
                            <span class="page3">3</span>
                        </span>
                        <span ng-click="GetMoviesData(4)">
                            <span class="page4">4</span>
                        </span>
                        <span ng-click="GetMoviesData(5)">
                            <span class="page5">5</span>
                        </span>
                    </p>
                </div>
              </div>
        </div> <!-- album END  -->


</div>

Здесь GetMoviesData (1) отправляет номер страницы функции для вызова нужной страницы для пути API.

Чего мне не хватает?

...