angular.js - angular登入完成後，如何正確在header顯示使用者數據

Question

如圖所示：右上角紅框內是登入成功後，使用者名稱顯示的位置

我現在是透過angular事件傳遞來做的。每次手動刷新頁面後，用戶的資料就取不到了。這是應該用那種方式來做比較好？求指教！

LoginController：登入視圖控制器

function LoginController($rootScope, $scope, $state, $window, AUTH_EVENTS, AuthService, ProfileService) {
    var vm = this;
    vm.login = login;
    
    function login() {

      var userInfo = {
        username: vm.username,
        password: vm.password
      };

      AuthService.login(userInfo).then(function () {
        ProfileService.fetchUserInfo().then(function (res) {
          $scope.$emit(AUTH_EVENTS.loginSuccess, res);
          $state.go('app.program.list');
        })
      })

    }

  }

AppCtrl：系統框架控制器，包含header

function AppCtrl($rootScope, $scope, $state, $translate,
                   $localStorage, $window, $document, $timeout,
                   cfpLoadingBar, AuthService, AUTH_EVENTS) {

    $rootScope.$on(AUTH_EVENTS.loginSuccess, function (e,data) {
      $rootScope.user = data.data;
    });
    
}）

Answer 1

雷雷