Anyone tried to change view via $location.path with ui-route, but with a parameter?
I'm trying to do that but it doesn't work. I think it's from my app.js routes definition that doesn't work
What I want is when I change to 'show-instance' (always with an id), I'm redirected to editing-instance.html.
controller.js
.saveShow($scope.spectacle)
.then(function (data) {
if ($scope.spectacle.ShowId === null) {
$location.path('show-instance/' + data);
}
else {
$location.path('listing-shows');
}
})
And in my app.js
$stateProvider.state('show-instance', {
url: '/show/instance/:eventId',
templateUrl: 'show/editing-instance/editing-instance.html'
});
Thanks for any help.
Instead of using $location, use the $state provider that comes with UI Router:
$state.go("show-instance", {
eventId: "123"
});
$state.go is the optimum approach while using ui.router. However if you need to use $location, then do not use the state name to transition. Use url instead.
$location.path('/show/instance/data')
Related
Hi guys am a beginner in mean stack development I have tried to refresh the page after logout.I have tried location.reload(); but it doesn't work tell me the possible code for page reload in this scenario
$rootScope.$on('$routeChangeStart', function (event) {
var storage = userService.isLoggedIn();
console.log(storage);
if (!storage) {
console.log('DENY');
$rootScope.adminlogin = "adminlogin";
console.log($rootScope.adminlogin);
$location.path('/login');
$route.reload();
// $state.go('/login', null, {reload: true});
}
else {
console.log('ALLOW');
$rootScope.admindashboard = "admindashboard";
var path = $location.path();
console.log(path);
console.log(storage);
if(path == '/login'){
$location.path('/');
}
}
});
You should use $window.location.reload() from the the $window service if you want to refresh the page. It does the same thing as the reload button in your browser.
The reason you should use the $window service instead of directly accessing the native window object as per the AngularJS documentation:
While window is globally available in JavaScript, it causes
testability problems, because it is a global variable. In AngularJS we
always refer to it through the $window service, so it may be
overridden, removed or mocked for testing.
On a side note as you stated you are using the $route service, just calling $route.reload() will only reload your controllers and not your entire application.
All you need to do is this little line of Vanilia JS:
document.location.href=document.location.href
EDIT: why is this getting downvoted?
if you are using routes, then on click of Logout just route it to your login page.
Snap shot from demo:
these are my routes:
$routeProvider
.when('/login', {
controller: 'LoginController',
templateUrl: 'modules/authentication/views/login.html',
hideMenus: true
})
.when('/', {
controller: 'HomeController',
templateUrl: 'modules/home/views/home.html'
})
.otherwise({ redirectTo: '/login' });
and when i click on 'Logout' on my page it should do somehting like:
<p>Logout</a></p>
it should redirect to login page as per routes.
I am trying to redirect to another page in my ionic app but stuck at this point. I see in console that my current path is what I want but I am not really on that page here is may code
.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {
$ionicConfigProvider.views.maxCache(0);
$stateProvider.state('homepage', {
url: '/homepage',
templateUrl: 'templates/homepage.html',
controller: 'MapController'
})
.state('hotel', {
url: '/hotel',
templateUrl: 'templates/hotel.html',
controller: 'HotelController'
})
})
Controller
.controller('MapController', function($scope, $location, customservice) {
$scope.fa = function(a) {
customservice.hotel_name = {hotelName: a.innerHTML}
console.log($location.path()) // prints /homepage
$location.path('/hotel');
console.log($location.path()) // print /hotel but still on same page
}
});
The $location service allows you to change only the URL; some time it dones not reload/redirect page. Can you try $window.location.href or $state.go(), instead of $location.path(). May be it will work.
I dont know how and why but wrapping it under $timeout did the job for me
It's very confusing thing. $location only changes url without reload.
You should write like this if you want to redirect.
$window.location.href = "http://www.google.com"
Please refer Angulardoc
When should I use $location?
Any time your application needs to react to a change in the current URL or if you want to change the current URL in the browser.
What does it not do?
It does not cause a full page reload when the browser URL is changed. To reload the page after changing the URL, use the lower-level API, $window.location.href
Try below:
angular.module('windowExample', [])
.controller('ExampleController', ['$scope', '$window', function($scope, $window) {
$window.location.href = '/hotel.html';
};
}]);
I am having issue when i try to logout and perform a location.path('/') to homepage.
Below is my code,
angular.module('MyApp')
.controller('LogoutCtrl', function($location, $auth,$rootScope) {
if (!$auth.isAuthenticated()) { return; }
$auth.logout()
.then(function() {
$auth.logout();
$rootScope.user='';
$location.path('/');
});
});
my app.js for this calling is :
.state('login.logout', {
url: '/logout',
template: null,
controller: 'LogoutCtrl'
})
I found that it is not redirecting when I perform the logout action in the same state. Which is http://localhost:8000/#/
But it will work when I'm in different state. Any guidance pls?
1.your using state provider, so whenever you want to redirect page using url need to use like
$location.url('/');
if you want to use path then u need to pass state name as parameter for $location
$location.path('/page/login');
here '/page/login' is your login or whatever page you want to redirect that page state.
I highly recommend you use ui-router for your redirects as well.
Have a 'home' state point to the '/' url
.state('Home', {
url: '/',
....
})
and then just do something like
$auth.logout()
.then(function() {
// do your cleanup
return $state.go('Home');
})
Try:
window.location.href = "/";
I am trying to get the query parameters from my angular UI router application. However I cannot seem to get them when I use the query method. The state params are always coming through as undefined.
$stateProvider.state("message",
{
views: {
"main-view": {
templateUrl: "admin/templates/message.html",
controller: ["$scope", "$stateParams", function ($scope, $stateParams )
{
// Get the params
$scope.message = $stateParams.message; // undefined
$scope.error = $stateParams.status; // undefined
}]
}
},
url: "/admin/message?message&status"
})
}
The URL i am using to access this state is:
http://localhost:8080/admin/message?message=hello&status=error
However if I use the Basic Parameters method it works fine. I.e:
url: "/admin/message/:message/:status"
...
http://localhost:8080/admin/message/hello/error
I have html5 mode activated (not sure if that affects it?)
My code has been simplified for the above - am I doing something wrong here? Have I forgot to include anything?
Thanks
I am trying to create a route that clears the users session and redirects them back to the root homepage.
.config(function config( $routeProvider, $stateProvider ) {
$routeProvider.
when('/logout', {resolve: {redirect: function(Session){
Session.clear();
return "/home";
}}});
I'm obviously doing something wrong here, as calling
$location.path("/logout");
... ignores the function and redirects back to the default route. I've tried adding console.log statements to the function to see if it is being called.
Am I using the redirect function incorrectly?
Have you considered putting your logout logic in a separate controller? Would be a little cleaner, more robust, & make redirection more straightforward. Like so:
function LogoutController($location) {
Session.clear();
$location.path('/home');
}
The your route is:
when('/logout', {
template: '', //A template or templateUrl is required by AngularJS, even if your controller always redirects.
controller: 'LogoutController'
}).
I had the same issue and what I did instead was create a logout function in my navigationController that gets hit when the URL is clicked
<li>Log Out</li>
And in my navigationController:
$scope.logout = function () {
localStorage.clearAll();
window.location = '/logout';
};
I'm running ASP.NET behind Angular so I needed the browser (not angular) to route to /logout which is mapped in ASP.NET config (does a few other session clean ups and redirects to authentication app)
Hope this helps
just store the $sessionStorage (username) then delete the the $sessionStorage (username) ..
$scope.logout = function(){
delete $sessionStorage.sessname; //sessname is get sessionStorage username
$location.path('/login');
};
help me for this link:https://stackoverflow.com/questions/36056745/angularjs-click-logout-button-to-clear-sessionstorage-again-and-again-go-back-to
I use this approach
$routeProvider
.when('/logout', {
resolve: {
logout: ['authService', function (authService) {
authService.clear(true);
}]
}
})