Angular js - 切换控制器（站点页面）时停止控制器的活动（http请求）

Question

在我的应用中一切都很好，但是

我遇到了一个奇怪的问题：

如果我在/channels 并启动pagination，则分页需要大约 5 秒才能结束，

所以如果在分页加载的同时，我 更改控制器并查看 浏览另一个应用程序页面，当分页完成他的过程时，我会被重定向到 /channels ：哦

这怎么可能？以及如何避免这种情况？

这是一段简单的代码：

 $routeProvider
        .when('/',{
            templateUrl:'views/home/index.html',
            controller:'HomeController'
        })
        .when('/auth/login',{
            templateUrl:'views/auth/login.html',
            controller:'UsersController'
        })
        .when('/auth/signup',{
            templateUrl:'views/auth/signup.html',
            controller:'UsersController'
        })
        .when('/channels',{
            templateUrl:'views/channels/index.html',
            controller:'BrowseController'
        })
        .when('/channels/search',{
            templateUrl:'views/channels/index.html',
            controller:'BrowseController',
            reloadOnSearch: false
        })
        .when('/channels/create',{
            templateUrl:'views/channels/create.html',
            controller:'ChannelsController'
        })
        .when('/users',{
            templateUrl:'views/users/index.html',
            controller:'UsersController'
        })
        .otherwise({
            redirectTo:'/'
        });

    app.controller('BrowseController',['$rootScope','$scope','$route','$routeParams','$http','$location','ngDialog', function($rootScope,$scope,$route,$routeParams,$http,$location,ngDialog) {
          $scope.layout.loading = true;
        $scope.pagination = {
            "keywords":$routeParams.keywords,
            "offset":$routeParams.offset ,
            "genre":$routeParams.genre ,
            "last_item":0,
            "results": []
        }

        $scope.redirect_pagination = function(_map){

            $location.path('channels/search').search(_map);

        }

        $scope.paginate = function(_offset,_genre,_keywords){
             $rootScope.layout.loading = true;
            if(!_offset){
                _offset = 1;
            }

            $http({
                method:'GET',
                url:$scope.config.app_ws+'get/channels/',
                params:{
                    offset:_offset,
                    genre:_genre,
                    keywords: _keywords
                }
            }).success(function(response){
            $scope.pagination.results.push(response);
            $scope.pagination.last_item = $scope.pagination.results.length;
            if($scope.config.app_url !== '/channels'){
                 $scope.redirect_pagination({
                    'offset':_offset,
                    'genre':_genre,
                    'keywords':_keywords
                });
             }

             $scope.pagination.offset = _offset * 2 ;
             $rootScope.layout.loading = false;
            }).error(function(status, response){
                alert('opsss');
            });
        }
        //default pagination or by url params

        $scope.paginate($scope.pagination.offset,$scope.pagination.genre,$scope.pagination.keywords);

    }])

其他东西：

$rootScope.$on('$routeChangeStart', function(newRoute, oldRoute) {
$rootScope.layout.loading = true;

//Make app scroll to top by default while navigating or use #anchor in url like http://sitse.com/someroute/?scrollTo=<:id_element:> to make it scroll to that element :id:
$location.hash($routeParams.scrollTo);
$anchorScroll();
//Close dialog every route change
ngDialog.close();

});
$rootScope.$on('$routeChangeError', function() {
//hide loading gif
$rootScope.layout.loading = false;
});
$rootScope.$on('$routeChangeSuccess', function() {
//Animate only some route
if($rootScope.layout.routes.indexOf($rootScope.config.app_url) == -1){
    $rootScope.layout.animation = false;
}else{
    $rootScope.layout.animation = true;
} 
//hide loading gif
$rootScope.layout.loading = false;

});

}]);

Answer 1

您需要一种方法来阻止$location.path() 将用户重定向回来。我能想到的一种方法是设置一个标志，如下所示：

app.controller('BrowseController', [..., function($scope, ...) {
    ...

    var paginationInProgress = false;

    // Cancel pagination if route has been changed
    $scope.$on('$routeChangeStart', function() {
        paginationInProgress = false;
    });

    $scope.redirect_pagination = function(_map){
        if (paginationInProgress) {
            $location.path('channels/search').search(_map);
            paginationInProgress = false;
        }
    };

    $scope.paginate = function(_offset,_genre,_keywords){
        ...
        paginationInProgress = true;
    };
}]);