登錄後顯示用戶信息AngularJS

我正在構建一個AngularJS應用程序，我想在用戶登錄時在頁面的標題中顯示用戶信息。例如「Welcome，{{username}}」。登錄後顯示用戶信息AngularJS

我已經創建了一個SessionHandler服務，用於保存有關用戶的信息。

module Shared{ 
    export class SessionHandler implements ISessionHandler { 

      loggedUser: string; 

      SetLoggedUser(user: string) { 
       this.loggedUser = user; 
      } 

      GetLoggedUser(): string { 
       return this.loggedUser; 
      } 
    } 
} 
angular.module("MainApp").service("SessionHandler", Shared.SessionHandler);

我試圖創建一個指令

angular.module("MainApp").directive("myheader", function() { 
    return { 
     restrict: "E", 
     templateUrl: "/app/shared/partials/header.html", 

     controller: function ($scope, SessionHandler: Shared.ISessionHandler) { 

      $scope.LoggedUser = function() { 
       SessionHandler.GetLoggedUser(); 
      } 
     } 
    } 
});

我的頭模板很簡單..

<span>{{LoggedUser()}}</span>

我主要的應用程序模塊看起來像這樣

angular.module("MainApp", ['ui.bootstrap','Login', 'Module2']) 
    ... 
    .run(($rootScope: ng.IRootScopeService, $location: ng.ILocationService, SessionHandler: Shared.ISessionHandler) => { 
     $rootScope.$on("$routeChangeStart", (event, next, current) => { 
      if (!SessionHandler.IsUserLoggedIn()) { 
       $location.path("/login"); 
      } 
      if (next.templateUrl == "/app/module/login/partials/login.html") { 
       SessionHandler.ClearSession(); 
       return; 
      } 
     }); 
    });

和我登錄控制器是我n登錄模塊在服務器上調用方法，並在成功登錄後通過在SessionHandler上調用SetLoggedUser（）方法來設置登錄用戶。

我的索引

<html data-ng-app="MainApp"> 
<head> 
</head> 
<body> 
<div class="container-fluid"> 
     <myheader></myheader> 

     <div data-ng-view=""></div> 
    </div> 
</body> 
</html>

當我開始我的應用程序登錄的用戶是空的，所以我只看到歡迎（我來解決這個版本），但我登錄後我重定向到另一個局部視圖，但什麼都在變化頭。我明顯錯過了一些東西，但我無法弄清楚什麼。

謝謝。

來源

2013-07-16 partyelite

在你的頭文件指令中你缺少依賴或者你可以說對你的SessionHandler服務的引用。

您可以嘗試添加並檢查接下來會發生什麼..

來源

2013-07-25 00:59:39

登錄後顯示用戶信息AngularJS

回答

相關問題