javascript - 未调用 Angular 登录/注销功能

标签 javascript angularjs authentication

我使用 Angular 和 JWT token 来验证用户身份。

但我面临一个问题,分配给 $scopelogin() 未被调用。任何帮助将不胜感激。

app.js 文件

var admin = angular.module('admin',['admin.core','admin.auth']);
angular.module('admin.core', ['ui.router','satellizer','ngResource','ngAnimate',
'ngStorage']);

admin.config(function($httpProvider, $stateProvider, $urlRouterProvider, 
$authProvider, $provide, $locationProvider) {
     $authProvider.loginUrl = '/api/authenticate';
$urlRouterProvider.otherwise('/login');

$locationProvider.html5Mode(true);

$stateProvider
    .state('login', {
        url: '/login',
        templateUrl: '/partials/admin/login.html',
        title : 'Admin Login'
    })
});

angular.module("admin.auth", []).controller("AuthController",AuthController);
function AuthController($auth, $state, $http, $rootScope, $scope) {
  console.log("Auth Called");
   $scope.email='';
   $scope.password='';
   $scope.newUser={};
   $scope.loginError=false;
   $scope.loginErrorText='';

   $scope.login = function() {

    var credentials = {
        email: $scope.email,
        password: $scope.password
    }

    $auth.login(credentials).then(function() {
        return $http.get('/api/authenticate/user');
    }, function(error) {
        $scope.loginError = true;
        $scope.loginErrorText = error.data.error;
    }).then(function(response) {
        if(typeof response != "undefined"){
          var user = JSON.stringify(response.data.user);
          localStorage.setItem('user', user);
          $rootScope.authenticated = true;
          $rootScope.currentUser = response.data.user;
          $scope.loginError = false;
          $scope.loginErrorText = '';
          $state.go('dashboard');
        }
    });
}

   $scope.logout = function() {
    $auth.logout().then(function() {
        // Remove the authenticated user from local storage
        localStorage.removeItem('user');
        // Flip authenticated to false so that we no longer
        // show UI elements dependant on the user being logged in
        $rootScope.authenticated = false;
        // Remove the current user info from rootscope
        $rootScope.currentUser = null;
        $state.go('login');
    });
}
}

我正在尝试使用 AuthConrtoller 就像

 <body ng-controller="AuthController">
     <ui-view></ui-view>
 </body>

login.html

<form name="loginForm" autocomplete="off" novalidate>
    <md-input-container class="md-block">
    <label for="email">Username</label>
     <input type="text" name="email" required="required" ng-model="email" md-no-asterisk/>
     <div ng-messages="loginForm.email.$error" role="alert">
        <div ng-message="required">Username is required</div>
      </div>
     </md-input-container>
      <md-input-container class="md-block">
        <label for="password">Password</label>
        <input type="password" name="password" required="required" ng-model="password" md-no-asterisk/>
        <div ng-messages="loginForm.password.$error" role="alert">
            <div ng-message="required">Password can not be blank</div>
        </div>
     </md-input-container>
      <md-button type="submit" class="md-primary md-raised" ng-disabled="!loginForm.$valid" ng-click="login()">Login</md-button>
</form>

最佳答案

您需要在路由配置中添加 Controller ,

$stateProvider
    .state('login', {
        url: '/login',
        templateUrl: '/partials/admin/login.html',
        controller : 'AuthController',
        title : 'Admin Login'
    })
});

您可以使用服务处理登录/注销功能并调用各种 Controller 内的函数。

演示

var app = angular.module('app', []);
app.controller('loginController',['$scope', 'MyUser',function($scope, MyUser)
{
    $scope.isloggedin = MyUser.getStatus();
    alert($scope.isloggedin);
}]);
app.service('MyUser', [function($scope) {
  this.loggedIn = false;
  return {
    getStatus: function() {
       this.loggedIn = true;
       return this.loggedIn;
    }
  }
}]);
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title></title>
</head>
<body ng-app="app" ng-controller="loginController">
  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js"></script>   
</body>
</html>

关于javascript - 未调用 Angular 登录/注销功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42143374/

相关文章:

javascript - 如何启用在数据表中搜索隐藏列?

javascript - 将 JSON 数据中的 "\"替换为 null

javascript - Angular 花括号不起作用,基本代码

javascript - Angular js 启动模块

ruby-on-rails - 在rails 4中设计用户模型中保存自定义字段

javascript - 制作一个简单的 javascript 计算器,无法将两个属性加在一起

javascript - Jquery Accordion 菜单 - 导航到新页面时保持打开状态

http promise 上的 javascript filter()

Angular 窗口未定义错误

node.js - 如何仅使用电子邮件 passport.js 对用户进行身份验证?