2016-03-22 9 views
0

In der Angular SPA-Anwendung wird der Anmeldebildschirm basierend auf der ng-show-Anweisungsvariablen in $ rootScope ein-/ausgeblendet.Angular JS - Anmeldebildschirm auf Seite Refresh (F5) der Anwendung

Wenn sich der Benutzer auf der Startseite befindet und die Seite aktualisiert (F5), wird der Anmeldebildschirm angezeigt, während die Seite "Complete" aktualisiert wird und den Wert des Stammbereichsvariablen verloren hat.

Wie behebt man dieses Problem?

Codebeispiel ::

<body ng-controller="mainController"> 
    <div class="container" ng-controller="schoolLoginCtrl" 
     ng-show="showLogin"> 
     <form class="form-signin" ng-submit="login()"> 
      <h2 class="form-signin-heading">Login Page</h2> 
      <label for="userName" class="sr-only">User Name</label> <input 
       type="text" id="userName" ng-model="user.userName" 
       class="form-control" placeholder="User Name" required autofocus> 
      <label for="inputPassword" class="sr-only">Password</label> <input 
       type="password" id="inputPassword" ng-model="user.password" 
       class="form-control" placeholder="Password" required> 
      <div class="alert alert-danger">{{errorMsg}}</div> 
      <button class="btn btn-lg btn-primary btn-block" type="submit">Sign 
       in</button> 
     </form> 
    </div> 

    <div class="container" ng-show="!showLogin"> 
     <div ng-view></div> 
    </div> 


.controller('mainController', function($scope, $rootScope, 
     $location) { 
    $rootScope.showLogin = true; 
}); 

Antwort

0

Verwendung ngcookie oder pouchdb oder local zum Speichern von Benutzersitzung

dies können Sie https://github.com/sahat/satellizer

+0

Das funktionierte für mich Schritte, denen ich folgte. 1) 2) füge 'ngCookies' eckiges Modul hinzu 3) füge $ cookies zum Controller hinzu 4) if ($ cookies.get (' showLogin ')! == undefined) { \t \t \t console.log ("Update-Cookie"); \t \t \t $ rootScope.showLogin = $ cookies.get ('showLogin'); \t \t \t $ cookies.put ('showLogin', $ cookies.get ('showLogin')); \t \t} sonst { \t \t \t $ rootScope.showLogin = true; \t \t \t console.log ("add cookie"); \t \t \t $ cookies.put ('showLogin', true); \t \t} – Madhu

0

helfen Sie werden irgendeine Art von Stateful-Speicherfunktionalität implementieren, müssen . Dies kann unter Verwendung von $cookies oder lokalem Speicher erreicht werden (es gibt viele Implementierungen von Drittanbietern).

0

Immer wenn Sie die Seite aktualisieren, werden alle Javascripts und andere Ressourcen erneut geladen, und so wird angularjs, das den $rootScope mit seinem Anfangswert neu initialisiert und alles, was daran gebunden ist, verloren geht.

Ich schlage vor, den Webspeicher (lokaler/Sitzungsspeicher) oder Cookies gemäß Ihren Anwendungsfällen und Anforderungen zu verwenden.

Verwandte Themen