nicht in der Lage, Scope-Wert nach Ajax-Aufruf aktualisiert

Question

Ich habe den folgenden Code versucht. Ich habe nach Antworten für die Antwort und Lösungen gesucht, um $ apply, $ timeout zu verwenden, aber irgendetwas hat in meinem Fall nicht funktioniert. Ich bekomme Bündelfehler.

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> 

Wert wird nicht aktualisiert zu werden ..

Answer 1

Sie haben <p>{{loginSuccess}}</p> außerhalb Ihrer ng-Ansicht. Daher ist der Bereich von loginCtrl nicht zugänglich. Entweder auf <p>{{loginSuccess}}</p> innerhalb von login.html zugreifen oder $rootScope.loginSuccess verwenden, damit es überall funktioniert.

Answer 2

können Sie versuchen, unter einem:

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

      }