$ StateChangeStartでAngularJSとui.routerを使用して、論理フローで$ rootScopeレベルのセッションAPIを処理します

Question

私がやっていることは、ユーザー認証を検証し、それに応じて応答することです。 $ rootScopeにセッションデータを入力するか、ログインページにリダイレクトします。セッションデータに他のコントローラやビューからアクセスできるようにしたい。

サーバーからセッション応答はJSONオブジェクトです：

var app = angular.module('app', ['ui.router']) 
    .config(function($stateProvider, $urlRouterProvider, $locationProvider){ 
     $stateProvider 
      .state('login', { 
       url: '/login', 
       templateUrl: 'app/views/login.html' 
      }) 
      .state('logout', { 
       url:'/logout', 
       templateUrl: 'app/views/login.html' 
      }) 
      .state('dashboard', { 
       url:'/dashboard', 
       templateUrl:'app/views/dashboard.html', 
       role: 0 
      }); 
     }) 
    .run(function($rootScope, $location, Data){ 
     $rootScope.$on('$StateChangeStart', function (event, toState, fromState) { 
      $rootScope.authenticated = false; 
      Data.get('session').then(function (results) { // Sends request to server the above mention JSON object is returned 
      if (results.user_id) { 
       $rootScope.authenticated = true; 
       $rootScope.user_id = results.user_id; 
       $rootScope.name = results.name; 
       $rootScope.user_email = results.user_email; 
      } else { 
       $location.path("/login"); 
      } 
     }); 
    }); 

その後、私のコントローラで：

app.controller('AuthCtrl', ['$scope','$rootScope', '$location', '$http', 'Data', function ($scope, $rootScope, $location, $http, Data) { 
    $scope.login = {}; 
    $scope.doLogin = function (user) { 
     Data.post('login', { // Sends login information to server    
      user: user 
     }).then(function (results) { 
      if (results.status == "success") { 
       $location.path('dashboard'); 
      } 
     }); 
    }; 
    $scope.logout = function() { 
     Data.get('logout').then(function (results) { // sends logout request to server 
      $location.path('login'); 
     }); 
    } 
}]); 

{"user_id":"17","name":"Administrator","user_email":"admin@example.com"} 

私app.jsは、このようになりますログイン機能とレスポンスは必要に応じて動作します。ログアウト機能が動作し、セッションが破棄されます。サーバー上のAPIは必要な方法で応答しますが、セッションデータは$ rootScopeに格納されず、アクセスできず、私のビューでは使用できません。

ダッシュボード・ビューは、次のようになります。私は正しく$rootScope.$on('$StateChangeStart', function(...)を使用していた場合

<div ng-controller="AuthCtrl"> 
    <h4>User Authenticated</h4> 
    User ID: {{user_id}} 
    <br/>NAME: {{name}} 
    <br/>E-MAIL: {{user_email}} 
    <br/> 
    <a ng-click="logout();">Logout</a> 
</div> 

私はよく分かりません。助言がありますか？

Answer 1

$stateChangeStartである必要があります。最初の文字は小文字で、大文字ではありません。