Steuerungsbereich variabel Laden nicht bis Refresh

Question

ich einen Login-Controller sein

myApp.controller('LoginCtrl', ['$scope', '$http','$location', function($scope, $http, $location) { 
    $scope.login = function() { 
     var data = JSON.stringify({user: $scope.user.id, password: $scope.user.password, type: "m.login.password"}); 
     $http.post("http://localhost:8008/_matrix/client/api/v1/login", data).then(function mySuccess(details){ 
      $http.post('/login',details.data).success(function(response){ 
       console.log(response); 
      }); 
      $location.path('home'); 
     }, function myError(err) { 
      console.log(err); 
      alert("Invalid username/password") 
     }); 
    }; 
}]); 

und eine Heimsteuerung

myApp.controller('HomeCtrl', ['$scope', '$http','$location', function($scope, $http, $location) { 
    console.log("Hello World from home controller"); 

    var refresh = function() { 
     $http.get('/roomNames').success(function(response) { 
      console.log("I got the data I requested"); 
      $scope.roomNames = response; 
     }); 
    } 
    refresh(); 
}]); 

Wie zu sehen ist, wenn die Login-Daten korrekt sind, die LoginCtrl die Route ändert sich zu home.html.

Wenn ich jedoch die Anwendung ausführen und erfolgreich anmelden, soll die HomeCtrl eine Anforderung an den Server für Daten für den angemeldeten Benutzer anfordern.

Was ich will ist, dass diese Daten als eine Liste in der home.html geladen werden. Hier ist mein home.html

<h3 class="subHeader"> Rooms </h3> 
     <ul class="nav nav-sidebar"> 
     <!-- <li class="active"><a href="#">Overview <span class="sr-only">(current)</span></a></li> --> 
     <li ng-repeat="room in roomNames"><a>{{room}}</a></li> 

     </ul> 

jedoch auf der erfolgreichen Anmeldung die roomNames Variable ist zunächst leer. Sobald ich die Seite aktualisiere, wird die HTML-Liste ausgefüllt.

Wie stelle ich sicher, dass die Liste ausgefüllt wird, sobald die home.html-Seite geöffnet wird?

Answer 1

versuchen, den Erfolg und errorcallbacks von $ http verwenden, wäre es besser, diese Funktion zu setzen in einer Fabrik

myApp.controller('HomeCtrl', ['$scope', '$http', '$location', 
 
    function($scope, $http, $location) { 
 
    console.log("Hello World from home controller"); 
 

 
    var refresh = function() { 
 
     $http.get('/roomNames') 
 
     .then(function successCallback(response) { 
 
      $scope.roomNames = response; 
 
     }, function errorCallback(response) { 
 
      //output an error if failed? 
 
     }); 
 
    } 
 
    refresh(); 
 
    } 
 
]);

Answer 2

Dies liegt daran, bewegen Sie sich auf Homepage auf, bevor Sie Server, auf den Sie zugreifen. Daher werden auf der Homepage die Daten nicht abgerufen und nach der Aktualisierung abgerufen.

Nur nach erfolgreicher Authentifizierung auf die Seite umgeleitet werden.

myApp.controller('LoginCtrl', ['$scope', '$http','$location', function($scope, $http, $location) { 
$scope.login = function() { 
    var data = JSON.stringify({user: $scope.user.id, password: $scope.user.password, type: "m.login.password"}); 
    $http.post("http://localhost:8008/_matrix/client/api/v1/login", data).then(function mySuccess(details){ 
     $http.post('/login',details.data).success(function(response){ 
      console.log(response); 
      $location.path('home'); // Redirect after success login 
     }) 
     .catch(function(data){ 
      console.error("Error in login",data); 
     }); 

    }, function myError(err) { 
     console.log(err); 
     alert("Invalid username/password") 
    }); 
}; 
}]);