AngularJs饼干不工作

Question

我正在学习Angular JS，并且遇到cookies问题。我有一个简单的登录工作正常，但是当我登录后刷新它使我回到登录页面。我想设置cookie，然后在保持登录状态。

app.js

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

myApp.config(['$routeProvider', function($routeProvider){ 
    $routeProvider. 
    when('/', { 
    templateUrl: 'views/home.html', 
    controller: 'loginController' 
}). 
when('/admin', { 
    resolve: { 
     "check": function($location, $rootScope){ 
      if(!$rootScope.loggedIn){ 
       $location.path('/') 
      } 
     } 
    }, 
    templateUrl: 'views/admin.html', 
    controller: 'loginController' 
}). 
otherwise({ 
    redirectTo: '/' 
}); 
}]); 

loginController.js

myApp.controller('loginController', ['$scope', '$http', '$location',  '$rootScope', 'userService', 'authService' '$cookies', function($scope, $http, $location, $rootScope, userService, authService, $cookies){ 

$scope.submitLogin = function(){ 
    if($scope.username == 'admin' && $scope.password == 'admin'){ 
     $rootScope.loggedIn = true; 
     //set date to 24 hours 
     var expireDate = new Date(); 
     expireDate.setDate(expireDate.getDate() + 1); 
     //set cookie 
     $cookies.put('userName', $scope.username, { 
      'expires': expireDate 
     }); 
     //get cookie 
     $rootScope.cookie = $cookies.get('userName'); 
     $location.path('/admin'); 
    } else { 
     alert("Wrong user name/password"); 
    } 
} 

}]); 

Answer 1

当您刷新$ rootScope.loggedIn不再存在的页面。您需要检查cookie的存在，而不是依赖内存变量。

我不能让codepen没有所有的依赖关系的工作，但基本上你的决心功能应该是这个样子：

resolve: { 
     "check": function($location, $rootScope) { 
     var cookie = $cookies.get('userName'); 
     console.log(cookie) 
     if (!cookie) { 
      $location.path('/') 
     } 
     }