如何在AngularJS中处理$ rootscope并获取登录用户的用户ID？

我想查找登录用户的ID并将其显示在页面中。我是新角度，我没有太多的线索如何处理会话。我有一个角度的应用程序连接到后端API（.net核心）。

我将显示网站中使用$ rootScope的实例（登录和授权已启用）。我需要了解这一点以了解该应用。

在App.js：

//Run phase 
myApp.run(function($rootScope, $state) { 
    $rootScope.$state = $state; //Get state info in view 

    //Should below code be using rootScope or localStorage.. Check which one is better and why. 

    if (window.sessionStorage["userInfo"]) { 

     $rootScope.userInfo = JSON.parse(window.sessionStorage["userInfo"]); 
    } 

    //Check session and redirect to specific page 
    $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){ 
     if(toState && toState.data && toState.data.auth && !window.sessionStorage["userInfo"]){ 
      event.preventDefault(); 
      window.location.href = "#login"; 
     }  

     if(!toState && !toState.data && !toState.data.auth && window.sessionStorage["userInfo"]){ 
      event.preventDefault(); 
      window.location.href = "#dashboard"; 
     } 
    }); 


});

Users.js：

'use strict'; 
angular.module('users', []); 

//Routers 
myApp.config(function($stateProvider) { 

    //Login 
    $stateProvider.state('login', { 
    url: "/login", 
    templateUrl: 'partials/users/login.html', 
    controller: 'loginController' 
    }); 
//Factories 
myApp.factory('userServices', ['$http', function($http) { 

    var factoryDefinitions = { 
     login: function (loginReq) { 
      $http.defaults.headers.common['Access-Control-Allow-Origin'] = '*'; 
      return $http.post('http://localhost:1783/api/token?UserName='+loginReq.username+'&password='+loginReq.password).success(function (data) { return data; }); 
     } 
} 

    return factoryDefinitions; 
    } 
]); 

//Controllers 
myApp.controller('loginController', ['$scope', 'userServices', '$location', '$rootScope', function($scope, userServices, $location, $rootScope) { 

    $scope.doLogin = function() { 

     if ($scope.loginForm.$valid) { 
      userServices.login($scope.login).then(function(result){ 
       $scope.data = result; 
       if (!result.error) { 
        window.sessionStorage["userInfo"] = JSON.stringify(result.data); 
        $rootScope.userInfo = JSON.parse(window.sessionStorage["userInfo"]); 
        //$localStorage.currentUser = { username: login.username, token: result.data }; 
        //$http.defaults.headers.common.Authorization = 'Token ' + response.token; 
        $location.path("/dashboard"); 
       } 
      }); 
     } 
    }; 
}]);

我才知道，有关用户的信息将在$ rootScope.userInfo可用。如果是这样，我怎么能在它内部获得价值？

如果可能，请用一个例子来解释。提前致谢。

来源

2016-09-25 Phoenix

一：

myApp.controller('loginController', [ 
'$scope', 'userServices', '$location', 
'$rootScope', 
function($scope, userServices, $location, $rootScope) {

控制器内，$rootScope注入，这使得你在该控制器访问userInfo。

所以如果你注入$rootScope到另一个控制器和console.log($rootScope.userInfo)你会看到用户数据。

myApp.controller('anotherController', ['$scope', '$rootScope', function 
($scope, $rootScope){ 

    console.log($rootScope.userInfo) //you'd see the users data from sessionStorage 

});

根据这个职位上Quora的

$范围的对象，它是由电流分量仅 e.g控制器，服务访问。 $ rootScope引用了一个可从应用程序的任何地方访问的对象。你可以认为$ rootScope是全局变量，$ scope是局部变量。

$rootScope Defn.

来源

2016-09-25 09:29:55

在你的情况下，一旦用户在sessionStorage的一个关键“用户信息”记录的创建和相同的数据被复制到$ rootScope.userInfo。要检查领域的用户信息登录后尝试

console.log($rootScope.userInfo);

，并在控制台打印或在浏览器调试工具打开你的会话存储[镀铬开放开发工具>应用程序>的sessionStorage>域名]查看值在“userInfo”键中。

假设你有

{ 
    uid: "10", 
    fullname: "John Doe" 
}

您可以用$ rootScope.userInfo.uid或$ rootScope.userInfo [ 'UID']脚本访问UID。

万一你是无法读取的代码，这里是一个解释

if (window.sessionStorage["userInfo"]) { 

    $rootScope.userInfo = JSON.parse(window.sessionStorage["userInfo"]); 
}

正在检查用户登录或没有。

工厂

myApp.factory('userServices', ['$http', function($http) { 

var factoryDefinitions = { 
    login: function (loginReq) { 
     $http.defaults.headers.common['Access-Control-Allow-Origin'] = '*'; 
     return $http.post('http://localhost:1783/api/token?UserName='+loginReq.username+'&password='+loginReq.password).success(function (data) { return data; }); 
    } 
}

是调用服务器来获取用户信息的对象。

$scope.doLogin = function() { 

    if ($scope.loginForm.$valid) { 
     userServices.login($scope.login).then(function(result){ 
      $scope.data = result; 
      if (!result.error) { 
       window.sessionStorage["userInfo"] = JSON.stringify(result.data); 
       $rootScope.userInfo = JSON.parse(window.sessionStorage["userInfo"]); 
       //$localStorage.currentUser = { username: login.username, token: result.data }; 
       //$http.defaults.headers.common.Authorization = 'Token ' + response.token; 
       $location.path("/dashboard"); 
      } 
     }); 
    } 
};

$ scope.doLogin正在调用上述工厂并存储userInfo对象。

来源

2016-09-25 09:37:34

如何在AngularJS中处理$ rootscope并获取登录用户的用户ID？

回答

相关问题