Mehrere Instanzen von eckigen Serviceobjekten werden erstellt

Question

Ich bin ziemlich neu in Angular und habe begonnen, einen Beispielworkflow zu erstellen. Ich habe einen eckigen Dienst, der Benutzer authentifiziert und die eingeloggten Benutzerdetails beibehält.

Bearbeiten: Ich habe zwei separate HTML-Seiten als Ganzes, schafft das ein Problem der Erstellung von zwei Instanzen.

studentApp.factory("loginService", function(){ 
    this.loggedUser="Guest!"; 
    return{ 
     checkCredentials : function(user){ 
      //Authenticating logic goes here. 
      this.loggedUser =user.username; 
     } 
    }; 
}); 

Nach einer erfolgreichen Anmeldung einer Homepage angezeigt wird, und es gibt den angemeldeten Benutzer Namen auf der HTML-Seite, indem Sie den Dienst wieder erreichbar.

studentApp.controller("headerController", ["loginService", function(loginService){ 
     var vm = this; 
     vm.loggedUser = loginService.loggedUser; 
}]); 

Aber es scheint, dass "Gast" angezeigt wird, anstatt den Benutzernamen. Ich denke, dass eine neue Dienstinstanz erstellt wird.

Answer 1

Versuch Getter-Methode in der Fabrik mit - fiddle

Beispiel -

app.factory("loginService", function(){ 
    this.loggedUser="Guest!"; 
    return{ 
    checkCredentials : function(user){ 
     //Authenticating logic goes here. 
     this.loggedUser =user; 
    }, 
    getLoggedUser : function(){ 
     return this.loggedUser; 
    } 
    }; 
}); 

Answer 2

Ich glaube, Sie verschiedene Controller für Login und Startseite verwenden. Wenn ja, verwenden Sie this in jedem Controller, der in jedem Controller neue Instanzen von Diensten erstellt.

studentApp.factory("loginService", function() { 
    return { 
    loggedUser : "Guest!", 
    checkCredentials: function(user) { 
      //Authenticating logic goes here. 
      this.loggedUser = user.username; 
     } 
    }; 
}) 

studentApp.controller("headerController", ["loginService", function(loginService){ 

     $scope.loggedUser = loginService.loggedUser; 
}]); 



studentApp.controller("LoginController", ["loginService", function(loginService){ 
     //login and then call checkcredentials(); 
      loginService.checkCredentials("name"); 
    }]);