Question

html：

<button class="submit" ng-disabled="dataloading" ng-class="{'vloader':newclass}" type="submit" flex="none"></button>

控制器：

loginModule.controller("loginController", ['$window', '$rootScope', '$scope', '$location', 'authenticationService', function($window, $rootScope, $scope, $location, authenticationService){
    $scope.newclass = false;
    $scope.login = function(){
        if($scope.form_login.$invalid){
            return false;
        }else{
            $scope.newclass = true;
            $scope.dataloading = true;
            authenticationService.login($scope.username, $scope.password, function(response){
                if(response.data.status_code == 200){
                    $window.location.href = 'view/home.html';
                }
            });
        }
    };
}]);

服务：

loginModule.factory('authenticationService', ['$http', '$cookieStore', '$rootScope', '$timeout', function($http, $cookieStore, $rootScope, $timeout){

    var service = {};

    service.login = function(username, password, callback){

        $http({
            method: 'POST',
            url: 'services/login',
            data: {usrname: username, password: password}
        }).then(function(response){
            callback(response);
        }, 
        function(response){
            alert('error');

 //need to set newclass and dataloading when http error occurs here ??

        })
    }
    return service;
}])

我正在尝试使用angular进行登录页面，上面的变量newclass和dataloading是在提交表单后更改类和禁用按钮。我在这里有一些问题

如果发生http错误，我不知道如何更改newclass和dataloading的值（在服务的注释行中无法访问这两个变量）。
发送时如何编码json数据（用户名和密码）？

Answer 1

对于第1点：

在你的回调中包含'err'参数，当服务中发生错误时，将其作为回复发送。

控制器：

loginModule.controller("loginController", ['$window', '$rootScope', '$scope', '$location', 'authenticationService', function($window, $rootScope, $scope, $location, authenticationService){
    $scope.newclass = false;
    $scope.login = function(){
        if($scope.form_login.$invalid){
            return false;
        }else{
            $scope.newclass = true;
            $scope.dataloading = true;
            authenticationService.login($scope.username, $scope.password, function(err, response){
                if(err) {
                  // Do Stuff
                }
                if(response.data.status_code == 200){
                    $window.location.href = 'view/home.html';
                }
            });
        }
    };
}]);

服务：

loginModule.factory('authenticationService', ['$http', '$cookieStore', '$rootScope', '$timeout', function($http, $cookieStore, $rootScope, $timeout){

    var service = {};

    service.login = function(username, password, callback){

        $http({
            method: 'POST',
            url: 'services/login',
            data: {usrname: username, password: password}
        }).then(function(response){
            callback(null, response);
        }, 
        function(response){
            alert('error');
            callback(response);

 //need to set newclass and dataloading when http error occurs here ??

        })
    }
    return service;
}])

对于第2点，请查看answer

登录后AngularJS禁用按钮

1 个答案: