$ rootScope geändert spiegelt sich nicht auf Vorlage

Question

Ich bin ein Neuling in angularjs. Ich versuche eine einfache App zu erstellen, die Login-Seite und Dashboard-Seite enthält.

Jetzt habe ich ein Problem mit der Aktualisierung der HTML-Vorlage, wenn rootScope geändert.

Hier meine Komponentenvorlage ist:

<!-- show dashboard page app > 
<div layout="column"> 
    <div ng-show="$rootScope.isAuthenticated"> 
    <pm-header></pm-header> 
    <div layout="row"> 
     <pm-sidebar></pm-sidebar> 
     <div layout="column" class="sitecontent" layout-padding> 
     <md-content ui-view></md-content> 
     </div> 
    </div> 
    </div> 

    <!-- show login page app > 
    <div ng-hide="$rootScope.isAuthenticated"> 
    <pm-homeheader></pm-homeheader> 
    <div layout="row"> 
     <md-content ui-view flex></md-content> 
    </div> 
    </div> 

</div> 

Anmeldung Blockcodes:

'use strict' 

export default ['$rootScope', '$state', '$http', '$window', function($rootScope, $state, $http, $window) { 
    this.user = {}; 

    this.login =() => { 
    $http.post('./api/auth/login', this.user) 
     .success(function(data, status, headers, config) { 
     $window.sessionStorage.token = data.token; 

     $rootScope.user = data.user; 
     $rootScope.isAuthenticated = true; 

     $state.go('home'); 
     }) 
     .error(function(data, status, headers, config) { 
     delete $window.sessionStorage.token; 
     }) 
    }; 
}] 

Mein Problem ist, wenn ich zu Hause Zustand angemeldet und gehen Sie zurück, um die ui-Router die Vorlage aktualisiert UI- Ansicht, aber die nicht die Änderungen in HTML widerspiegeln, zeigt es die Block-Codes der Homepage statt Dashboard-Seite.

Kann mir jemand für diesen Fall helfen, vielen Dank.

Answer 1

Verwendung:

ng-show="$root.isAuthenticated" 

Sie nicht mehr als $ rootScope in der Vorlage zugreifen können, wenn Sie es in einem Controller zugreifen injizieren Sie es in $ root funktioniert, weil, wenn Winkel eine rootScope schafft es einen Verweis setzt auf. $ root für sich selbst, so wie das Zugreifen auf eine andere Eigenschaft auf dem Bereich.

Siehe AngularJS rootScope Code Zeile 135: https://github.com/angular/angular.js/blob/v1.3.6/src/ng/rootScope.js#L135

Answer 2

Sie auch nicht $scopeOR$rootScope verwenden sollten, während Variable auf HTML für die Bindung, so sobald variable Update in $rootScope wird isAuthenticated von $rootScope genommen werden, während Wert von ng-show auswertet.

ng-show="isAuthenticated" 

---

Obwohl direkt $rootScope verwendet wird, würde als eine gute Praxis nicht in Betracht ziehen. Ich würde vorschlagen, dass Sie einen Service/eine Fabrik mit einem Namen erstellen, der shareable Benutzerinformationen unter st Winkelkomponenten haben wird.