ajax调用后无法获取更新的范围值

时间:2016-05-22 07:04:35

标签: jquery html angularjs ajax

我尝试了以下代码。我已经搜索了答案和解决方案的答案,使用$ apply,$ timeout但是在我的情况下,任何事情都不起作用。我收到了一堆错误。

JS:

var app = angular.module("test",[])
app.config(function($routeProvider, $locationProvider) {
  $routeProvider
    .when('/', {
        templateUrl: 'login.html',
         controller: 'loginCtrl'
    })
 });

app.controller("loginCtrl",["$scope","$http","$location",function($scope,$http,$sessionStorage,$location,$timeout) {
    $scope.loginSuccess = false;
    $scope.loginAuthencation = function(){
        $http({
            method: 'post',
            url:'http://192.168.42.200:5000/authenticate',
            data:{"username":$scope.username,"password":$scope.password}
        }).then(function successCallback(successResponse) {
            console.log(successResponse);
            if(successResponse.data.status==="success"){                                    
                $scope.loginSuccess = true; 
            } else {
                $scope.loginSuccess = false;
            }
        }, function errorCallback(response) {
            $scope.loginSuccess = false;
        });
    }
}]);

index.html:

<p>{{loginSuccess}}</p>
<div ng-view></div>

的login.html:

<div>
    <img src="img/logo.png" alt="appicon"/>
</div>
<div class="sub-element">
    <p><input type="text" name="username" placeholder="username" ng-model="username"/></p>
    <p><input type="password" name="password" placeholder="password" ng-model="password"/></p>
</div>
<input type="checkbox" value="Remember Me" class="item-left"/>Remember Me
<p class="submit-btn"><input type="submit" id="login-form" value="Login" ng-click="loginAuthencation()" /></p>

值未获得更新...

2 个答案:

答案 0 :(得分:1)

您的ng-view之外有<p>{{loginSuccess}}</p>。因此无法访问loginCtrl的作用域。在login.html中访问<p>{{loginSuccess}}</p>或使用$rootScope.loginSuccess以便它可以在任何地方使用。

答案 1 :(得分:-1)

你可以尝试下面的一个:

    function(successResponse) {   
                if(successResponse.data.status==="success"){                                        
                    $scope.loginSuccess = true;     
                } else {
                    $scope.loginSuccess = false;
                }
              if(!$scope.$$phase) {
               $scope.$digest();
}

            }