ajax呼び出し後に更新されたスコープ値を取得できません

Question

以下のコードを試しました。私は答えと$ 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> 

値が更新取得されていません。..

Answer 1

あなたのビューの外に<p>{{loginSuccess}}</p>があります。したがって、loginCtrlのスコープにはアクセスできません。 login.html内の<p>{{loginSuccess}}</p>にアクセスするか、$rootScope.loginSuccessを使用して、どこでも動作します。

Answer 2

あなたが1を下回る試すことができます：

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

      }