使用AngularJS工厂进行身份验证

使用AngularJS工厂进行身份验证,angularjs,authentication,service,Angularjs,Authentication,Service,对AngularJS来说是新的。。我想利用一个控制器(我称之为“AccessCtrl”)和服务,使用一个登录页面构建一个简单的登录屏幕 我希望控制器使用一个服务(我称之为“AuthService”),该服务将执行验证用户名/密码的REST调用,并且还将包含有关登录尝试成功或失败的信息 我想接收有关上次登录尝试的信息(由REST调用返回)。现在-我只想在登录屏幕上显示一个字符串(例如“密码无效”或“帐户过期”或“欢迎”)。我把它作为AuthService服务的一个属性,我希望显示它 我的视图有一个

对AngularJS来说是新的。。我想利用一个控制器(我称之为“AccessCtrl”)和服务,使用一个登录页面构建一个简单的登录屏幕

我希望控制器使用一个服务(我称之为“AuthService”),该服务将执行验证用户名/密码的REST调用,并且还将包含有关登录尝试成功或失败的信息

我想接收有关上次登录尝试的信息(由REST调用返回)。现在-我只想在登录屏幕上显示一个字符串(例如“密码无效”或“帐户过期”或“欢迎”)。我把它作为AuthService服务的一个属性,我希望显示它

我的视图有一个表单,其中包含用户名、密码和一个提交按钮,该按钮调用控制器的login()方法。我不是为了简洁才把它包括在这里的。我认为这不是问题所在

首先,我想使用相同的服务捕获服务器何时关闭/不可用等,并报告这一情况。首先-所有调用都将失败(因为我有一个无效的url)

控制器的定义如下:

angular.module('loginApp')
  .controller('AccessCtrl', ['$scope','$http','AuthService', 
    function ($scope,$http,AuthService,Config) {

        this.login =function() {
          var user={user:this.username,password:this.password,otherCredentials:this.otherCredentials} ;

          AuthService.login(user);
          this.message=AuthService.message;
        };
  }]);
我的工厂服务定义如下:

.factory('AuthService', ['$http', function ($http) {
      var authService = {};
      var apiRootUrl="http://somesite.com/urany";

      authService.login = function (credentials) {
        authService.message="";
        $http.post(apiRootUrl+'/login', credentials)
          .then(
            function (response) {
                // populate OK message
                authService.message="Welcome !";
            },
            function (response) {
                // Currently - all calls fail, as the URI is invalid
                // I want to trap this.
                authService.message = "Server unavailable with response status = " + response.status ;      
                return authService;

            },
            function(response) {
                // this is the notify callback function.
                // 
            });
      };

      authService.isAuthenticated = function () {
        // rerurn true or false if previously authenticated
        return true;
      };

      return authService;
}])
)

问题是我的无效消息(“服务器不可用,响应状态…”)没有出现在我的视图中

在单步执行代码时,会调用正确的authService函数,但这似乎没有填充到控制器/视图中

我有一种感觉,这是一个计时问题,控制器正在执行

this.message=AuthService.message;
在电话真的从邮局回来之前——但我不确定情况是否如此,也不知道如何解决这个问题

欢迎提供任何帮助/线索

谢谢


你试过这样的东西吗

角度服务代码:

     //call the service
     AuthService.login(user).then(function(response){//begin call back

    //store the response data message object property returned from the service
    $scope.message = response.message;


      }//end call back

你试过这样的东西吗

角度服务代码:

     //call the service
     AuthService.login(user).then(function(response){//begin call back

    //store the response data message object property returned from the service
    $scope.message = response.message;


      }//end call back