无法在angularJS登录页面上显示错误消息

时间:2017-07-02 05:03:32

标签: javascript angularjs

我有一个spring boot应用程序,其中配置了angularjs,在ajax调用中进行身份验证,如果身份验证失败,则执行错误回调,在此错误回调中我收到错误消息作为数据的一部分我必须在登录页面上显示它不能正常工作。下面是错误回调方法

onerror = function(data){
           console.log(data); -- the output of data is as below 

"timestamp":1498971200809,"status":401,"error":"Unauthorized","message":"check your password","path":"/demo/authenticate"}

           vm.error= true; // setting error to true
           vm.errMessage = data.message; // here data.message gives me 
                                            undefined

           $location.path("/customlogin");
       }

customlogin.html代码

    <body ng-controller="ContactLoginCtrl as Contactctrl">

        <div ng-if="Contactctrl.error"> -- this is always evaluating false 
                    {{Contactctrl.errMessage}}
                </div>
   </body>

在上面的代码片段中,我们正在检查控制器的错误变量,如果它是真的(在错误回调方法中设置)我必须显示在上面显示的错误方法回调中设置的errMessage。

我没有弄到我做错了,请一些身体帮助我

ContactLoginCtrl.js

angular.module('baseApp')
.controller('ContactLoginCtrl', ['$scope','AuthenticateService','$location',function($scope,AuthenticateService,$location){
    console.log("in the controller")
   var vm =this;
    vm.error=false;
    vm.errMessage="";
    vm.authenticate = function(userModel){
        //alert(userModel.username);
        var userName = userModel.username;
        var password = userModel.password;
        //console.log(userName+password);
        var result = AuthenticateService.login(userName,password);
        result.success(onsuccess)
              .error(onerror);
    }



        onsuccess = function(data){

            var usernameResult = AuthenticateService.getCredentials();
            usernameResult.success(onusersuccess)
                           .error(onusererror);


        };
       onerror = function(data){

           vm.error= true;
           vm.errMessage = data.message;
           alert(vm.errMessage);
           $location.path("/customlogin");
       }



       onusersuccess = function(data){
           console.log("userData"+JSON.stringify(data))
            $location.path("/home");


        };

        onusererror = function(data){
             console.log(data);

        };
}]);

下面控制台输出的截图

enter image description here

1 个答案:

答案 0 :(得分:0)

我认为您在错误的功能或功能中设置的值不是您想要做的。在error中设置errMessageonusererror的值。正如您在评论中所述,您正在onusererror打印该值,这意味着您从success获得AuthenticateService.login(userName,password);并且无法调用onerror

   onerror = function(data){

       vm.error= true;
       vm.errMessage = data.message;
       alert(vm.errMessage);
       $location.path("/customlogin");
   }



   onusersuccess = function(data){
       console.log("userData"+JSON.stringify(data))
        $location.path("/home");


    };

    onusererror = function(data){
         console.log(data);
         vm.error= true;
         vm.errMessage = data.message;
         alert(vm.errMessage);
         $location.path("/customlogin");

    };