2016-11-25 15 views
-2

ここは私の問題です。 angularjsで新しいです、私はログインしたユーザーの情報を取得したいと思います。だから私はそれを表示することができます。私はここからどのように、どこから始めるべきか、私の主な角度コントローラーはわかりません。ログインしたユーザー情報を取得したい

var myApp = angular.module('myApp', ['ngResource', 'ngRoute']); 

myApp.config(function ($routeProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl: 'partials/main.html', 
     access: {restricted: true} 
    }) 
    .when('/api/meetups', { 
     templateUrl: 'partials/main.html', 
     access: {restricted: true} 
    }) 
    .when('/login', { 
     templateUrl: 'partials/login.html', 
     controller: 'loginController', 
     access: {restricted: false} 
    }) 
    .when('/prive', { 
     templateUrl: 'partials/prive.html', 
     controller: 'userController', 
     access: {restricted: true} 
    }) 
    .when('/logout', { 
     controller: 'logoutController', 
     access: {restricted: true} 
    }) 
    .when('/register', { 
     templateUrl: 'partials/register.html', 
     controller: 'registerController', 
     access: {restricted: false} 
    }) 
    .when('/one', { 
     template: '<h1>This is page one!</h1>', 
     access: {restricted: true} 
    }) 
    .when('/two', { 
     template: '<h1>This is page two!</h1>', 
     access: {restricted: false} 
    }) 
    .otherwise({ 
     redirectTo: '/' 
    }); 
}); 

myApp.run(function ($rootScope, $location, $route, AuthService) { 
    $rootScope.$on('$routeChangeStart', 
    function (event, next, current) { 
     AuthService.getUserStatus() 
     .then(function(){ 
     if (next.access.restricted && !AuthService.isLoggedIn()){ 
      $location.path('/login'); 
      $route.reload(); 
     } 
     }); 
    }); 
}); 


myApp.controller('meetupsController', ['$scope', '$resource', 'AuthService', function ($scope, $resource, AuthService) { 
    var Meetup = $resource('/api/meetups'); 
$scope.meetups = [] 

    Meetup.query(function (results) { 
    $scope.meetups = results; 
    }); 



    $scope.createMeetup = function() { 
    var meetup = new Meetup(); 
    meetup.name = $scope.meetupName; 
    meetup.text = $scope.username; 
    meetup.$save(function (result) { 
     $scope.meetups.push(result); 
     $scope.meetupName = ''; 
     $scope.username = ''; 
    }); 
    } 





}]); 
myApp.controller('userController', ['$scope', '$resource', function ($scope, $resource) { 
/* var Meetup = $resource('/api/user'); 
$scope.users = [] 

    Meetup.query(function (results) { 
    $scope.users = results; 
    }); 
*/ 

var Meetup = $resource('/api/user', {},{ 
    query: {method: 'get', isArray: true} 
}); 
$scope.users = [] 
$scope.text='mikyas'; 
    Meetup.query({text: $scope.text}).$promise.then(function (results) { 
    $scope.users = results; 
    }, function(error) { 
    // console.log(error); 
    $scope.meetups = []; 
}); 

}]); 

誰でもコードを提供できますか。

答えて

0

これは、サービスがAngularで行うことです。私のアプリケーションの1つで使用している認証サービスの例を次に示します。アプリケーションを閉じた後にユーザーをログインさせたままにしたい場合は、そのユーザーをローカルストレージに保存する必要があります。

app.factory('AuthService', ['$q', '$http', 'LocalStorageService', 
    function($q, $http, LocalStorageService) { 
    var service = {}; 

    service.user = LocalStorageService.get("AUTH_USER", null); 

    service.isLoggedIn = function(){ 
     return service.user != null && service.user != undefined && service.user != ""; 
    } 

    service.checkLogged = function(){ 
     return $http.get(APPCONFIG.apiAccessPoint + "/user/" + service.user._id + "/isLogged").then(function(response){ 
      if(!response.data.success || !response.data.logged){ 
       service.logout(); 
       return false; 
      } 
      else{ 
       return true; 
      } 
     }, function(response){ 
      service.logout(); 
      return false; 
     }); 
    } 

    service.login = function(name, password){ 
     return $http.post(APPCONFIG.apiAccessPoint + "/user/login", {name: name, password: password}).then(function (response){ 
      if(response.data.success){ 
       LocalStorageService.set('AUTH_USER', response.data.data); 
       $http.defaults.headers.common.Authorization = 'Bearer ' + response.data.data.token; 
       service.user = response.data.data; 
      } 
      return response.data; 
     }, function (response){ 
      if(response.status == 400 || response.data.error_code == "VAL_ERROR"){ 
       return response.data; 
      } 
      else{ 
       return $q.reject(); 
      } 
     }); 
    } 

    service.logout = function(){ 
     // remove token from local storage and clear http auth header 
     LocalStorageService.deleteValue("AUTH_USER"); 
     $http.defaults.headers.common.Authorization = ''; 
     service.user = null; 
    } 

    return service; 
}]); 

そして、これはあなたが(プロファイルを示すなど)のコントローラでサービスを使用する方法である:

app.controller('ProfileViewCtrl', ['$scope', '$routeParams', 'AuthService', 'UserService', 
function($scope, $routeParams, AuthService, UserService) { 

    $scope.isLogged = AuthService.isLoggedIn(); 
    $scope.user = null; 
    $scope.notFound = false; 
    $scope.ownProfile = false; 

    $scope.user = UserService.getUser($routeParams.user).then(function(response){ 
     if(response.success){ 
      $scope.user = response.data; 
      $scope.notFound = response.data == undefined; 
      if(!$scope.notFound && $scope.isLogged){ 
       $scope.ownProfile = $scope.user._id == AuthService.user._id; 
      } 
     } 
     else{ 
      console.log(response.data); 
     } 
    }); 


}]); 

またはログインページを持つ:あなたの貴重なため

app.controller('LoginCtrl', ['$scope', '$route', 'AuthService', 
    function($scope, $route, AuthService) { 

    $scope.user = {}; 

    $scope.login = function(){ 
     AuthService.login($scope.user.name, $scope.user.password).then(function(response){ 
      if(response.success){ 
       $route.reload(); 
      } 
      else{ 
       console.log("Wrong User or password..."); 
      } 
     }); 
    } 
}]);  
+0

10Q私の角速度コントローラにあなたのコードを追加するのですか?助けてください –

+0

私はコントローラでサービスをどのように使用するかの例を追加しました。 – Jodo

+0

どうもありがとうございました –

関連する問題