AngularJS Partial Views Security - angularjs

Question

I'm trying to secure the partial views so user cannot't switch views without a login but having trouble. The code is below:
var loginApp = angular.module('loginApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ngRoute'
])
//
//
//
// -------------- Cannot get this to work ------------
//
//
//
// loginApp.factory('authInterceptor', function ($q, $location) {
// debugger;
// return {
// request: function (config) {
// config.headers = config.headers | {};
// if (localStorage.auth_token) {
// config.headers.token = localStorage.auth_token;
// }
// return config;
// },
// responseError: function (response) {
//
// if (response.status === 401 || response.status === 500) {
// $location.path('/');
// }
// return $q.reject(response);
// }
// }
// })
//
// loginApp.config(function ($httpProvider) {
// $httpProvider.interceptors.push('authInterceptor');
// })
loginApp.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/login.html',
controller: 'loginController'
})
.when('/expertView', {
templateUrl: 'views/b.html',
controller: 'bViewController'
})
});
loginApp.controller('bViewController', function ($scope) {
//$scope.message = 'Everyone come and see how good I look!';
});
var loginController = function ($scope, $http, $location) {
$scope.user = {};
$scope.user.username = "name";
$scope.user.userID = "123456";
$scope.user.password = "444444444";
$scope.user.ui = "true";
$scope.user.submitForm = function (item, event) {
var data = {
userID: $scope.user.userID,
password: $scope.user.password,
ui: $scope.user.ui
};
$http({
url: '/api/v1/auth/login',
method: "POST",
dataType: "json",
data: data,
headers: {
'Accept': 'application/json, text/javascript',
'Content-Type': 'application/json; charset=utf-8'
}
}).success(function (data, status, headers, config) {
console.log("Success!");
}).error(function (data, status, headers, config) {
console.log("Submitting to Server failed!");
});
}
}
I just need to secure the views and make sure user cannot (switch) access views without login.

Answer 1

First create a constant that can determine the access level for each route for example
angular.module("App")
.constant('USER_ROLES', {
logedIn : 'true'
});
then add them to the definition of the route as
.when('/write',{
templateUrl:'templates/write.html',
access_level:USER_ROLES.logedIn
})
After that in the run function check $rootScope.$on('$locationChangeStart' event and inside it you can access the route by var location = $location.path(); var route = $route.routes[location];and then access the user role by route.access_level;