We Keep Coding

How can i set/remove locastorage particular url(route) opened in browser using angularjs?

When user open user.html(user route) need to store(this should be avilable in entire application) localStorage.setItem('user',"true");
when user close user.html(means user close this particular tab(url/route) in browser) need to remove localstorage .how can i achieve this help me out to move forward
below is my code
var app = angular.module('Test', ['ngResource', 'ngRoute']);
app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider){
$locationProvider.hashPrefix('');
$routeProvider
.when('/', {
templateUrl: 'home.html'
})
.when('/user', {
templateUrl: 'user.html',
controller: 'User'
})
.otherwise({
redirectTo: '/'
});
}]);
app.controller('User', function($scope) {
localStorage.setItem('user',"true");
});

How can i add another one route in this code?

i need to add admin user. I read that i need to separate routes in my app.js file. But i can't find example that i need to done this. May be someone can help me to fix this problem ?
(function () {
'use strict';
angular
.module('app', ['ngRoute', 'ngCookies'])
.config(config)
.run(run);
config.$inject = ['$routeProvider', '$locationProvider'];
function config($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
controller: 'HomeController',
templateUrl: 'home/home.view.html',
controllerAs: 'vm'
})
.when('/login', {
controller: 'LoginController',
templateUrl: 'login/login.view.html',
controllerAs: 'vm'
})
.when('/register', {
controller: 'RegisterController',
templateUrl: 'register/register.view.html',
controllerAs: 'vm'
})
.when('/admin', {
controller: 'AdminController',
templateUrl: 'admin/admin.view.html',
controllerAs: 'vm'
})
.otherwise({ redirectTo: '/login' });
}
run.$inject = ['$rootScope', '$location', '$cookies', '$http'];
function run($rootScope, $location, $cookies, $http) {
// keep user logged in after page refresh
$rootScope.globals = $cookies.getObject('globals') || {};
if ($rootScope.globals.currentUser) {
$http.defaults.headers.common['Authorization'] = 'Basic ' + $rootScope.globals.currentUser.authdata;
}
$rootScope.$on('$locationChangeStart', function (event, next, current) {
// redirect to login page if not logged in and trying to access a restricted page
var restrictedPage = $.inArray($location.path(), ['/login', '/register']) === -1;
var loggedIn = $rootScope.globals.currentUser;
if (restrictedPage && !loggedIn) {
$location.path('/login');
}
});
}
})();

Take a look at this gist
Basically what you need is attach some restriction related data to your route and check on page transition if you are authorized and redirect if not.
Dedicated AuthService can contain currentUser and authorization data instead of chaotic data in the run block.

AngularJS not loading templates in Codeigniter

I'm trying to use Angular with my Codeigniter project. The problem is that it doesn't load the proper template file through angular router.
In the root instead of showing templateUrl: 'index.php/welcome/home', it loads the index.php/welcome. It loads the index page inside the controller instead of the ones I have specified.
Below is my code:
JS
var app = angular.module('MyCtrl', ['ngRoute', "ui.bootstrap.modal"]);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'index.php/welcome/home',
controller: 'mainController'
})
.when('/user', {
templateUrl: 'index.php/user/account',
controller: 'userController'
})
});
app.controller('mainController', function($scope) {
$scope.message = 'main con';
});
app.controller('userController', function($scope) {
$scope.message = 'user con!';
});
Welcome controller in Codeigniter:
public function home(){
$this->load->view('home');
}
Can someone tell me why this is not working and what I have done wrong?

AngularJS: Component controller not loaded when routing with ngRoute

I am an AngularJS beginner. I have the following code:
A component defined by the following js file:
angular.module('EasyDocsUBBApp')
.component('loginTag', {
templateUrl: 'login-tag/login-tag.html',
controller: function () {
alert(1);
this.login = function () {
console.log(this.username + ':' + this.password);
};
}
});
The content of my app.js file, where I also configured the routing is:
var app = angular.module('EasyDocsUBBApp', ['ngRoute']);
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'login-tag/login-tag.html'
})
.when('/test', {
templateUrl: 'test.html'
})
.otherwise({
redirectTo: 'login-tag/login-tag.html'
});
});
My issue is that the controller is not loaded (the alert window does not appear). Could someone indicate me what I did wrong? (if any supplementary details on my code are needed, please tell me)

In your configuration for $routeProvider, try this:
.when('/', {
template: '<login-tag></login-tag>'
})
Remember to add your component.js to your index file.

switch views from one page to another when the button is clicked in angular JS

I am new to angular JS.How can I redirect to another page when the button is clicked.
My code here
var app = angular.module("plunker", [])
.config(function ($routeProvider, $locationProvider, $httpProvider) {
$routeProvider.when('/home',
{
templateUrl: 'home.html',
controller: 'HomeCtrl'
});
$routeProvider.when('/about',
{
templateUrl: 'about.html',
controller: 'AboutCtrl'
});
$routeProvider.when('/contact',
{
templateUrl: 'contact.html',
controller: 'ContactCtrl'
});
$routeProvider.otherwise(
{
redirectTo: '/home',
controller: 'HomeCtrl',
}
);
});
app.controller('NavCtrl',
['$scope', '$location', function ($scope, $location) {
$scope.navClass = function (page) {
var currentRoute = $location.path().substring(1) || 'home';
return page === currentRoute ? 'active' : '';
};
}]);
app.controller('AboutCtrl', function($scope, $compile) {
console.log('inside about controller');
});
app.controller('HomeCtrl', function($scope, $compile) {
console.log('inside home controller');
//redirect when button click
function Cntrl ($scope,$location) {
$scope.redirect = function(){
window.location.href = '/about';
}
}
});
app.controller('ContactCtrl', function($scope, $compile) {
console.log('inside contact controller');
});
my html markup is
<div ng-controller="Cntrl">
<button class="btn btn-success" ng-click="changeView('about')">Click Me</button>
</div>
You entered :
How to get this.help me to solve this .

Just use a standard HTML link :
<div ng-controller="Cntrl">
<a class="btn btn-success" ng-href="#/about">Click Me</a>
</div>
No need to create a scope function for that. You can also handle that dynamically thanks to ng-href :
<div ng-controller="Cntrl">
<a class="btn btn-success" ng-href="#/{{view}}">Click Me</a>
</div>
Last thing, you should consider using ui-router which handle even better this cases

Why do you need to send the view as a param:
Try this:
$scope.changeView = function() {
$location.path(#/about);
}

If solution that Cétia presented does not work, then it is possible that you do not have your routes defined. Make sure that you have your route defined withing app.js like this :
app.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/Login', {
templateUrl: 'Navigate/LoginView',
controller: 'someLoginController'
})
]);
You can as well use angulars state provider (do some research) and from state provider you can access your routes within html as :
<a href="state.routName" />