I have some variables in angular controller. I have there if user is logged in and other details . When i am refreshing my page using f5 all my variables are reloading and i am getting in log in page, but before refresh i was already logged in and my variable isUserLoggedIn was true but after refresh it is false , false is this variables default value, I am declaring it in Controller .How can I save all my variables ( current point of angular controller ) and continue with my saved point after refresh ?
You can use the browsers local storage(HTML5) and store your data.
E.g:
to write:
$window.localStorage['sample-key'] = 'sample-data;
to read:
var data = $window.localStorage['sample-key']
There are many libraries available for this, you can check this one:
https://github.com/grevory/angular-local-storage
Related
is it possible to clear all fields in one controller by clicking on a button from the previous controller?
I'm trying to do so by setting cache: false in routes.js in the controller that needs to be cleared, however, I realized that it clears the controller's fields every time it's loaded.
I need to be able to clear the fields of the pages once a user clicks on login, however, I also need to be able to go back to the previous pages once I enter the "review info" page.
How should I go about this?
If you are using ionic version-1 framework, then use
$scope.logout = function(){
// first, clear the history
$ionicHistory.clearHistory();
// clear the cache before you navigate to a page
$ionicHistory.clearCache().then(function(){
$state.go("app.login");
});
}
In button click event my state is going to change from one state to another.thats way I am passing Id value by using ui-sref.
this is my button declaration for id:-
<button ui-sref="list({id:'{{id}}'}"></buton>
In state I am getting value like
.state(list, {
url: '/list',
params:{id: 'null'},
template:''
})
The url should not contain id value,thats way i choose the above approach.The param value getting fine in first time loading but when i am going to refreash the page the param value became null again.
My button is in one controller(a.controller.js), and /list is another controller(b.controller.js).After changing state I want id in b.controller.js.
I tried but i was getting a proper solution for this situation except local storage.I donot want to store my value in local storage.So please any one can help me solve this problem.
Its normal to loose everythink when you refresh your page in angularJS (the major intrest of angularJs is that you have not to refresh your page !)
If you want to keep a value you need to store it in a database with an API or in a simpler way you can store it in the localstorage of the users browser.
localStorage.setItem('todos', JSON.stringify($scope.todos));
Exemple of a simple localstorage use in angular
#Katie Harron
If that you call refresh is just state change you have to store your value in $rootScope
If an user is coming from an specific page i need to do get some values out of a cookie and change what the users sees.
Now, the issue is that i cannot find a way to view what page the user is coming from.
EDIT: This is intended to capture when the users clicks back in a page and save the state of the previous page.
Any ideas?
Thanks in advance
Solved. Every time i load a page i'm saving the url, so when i get to this page i just have to read it to tell. Thanks!
You can use browser history in our javascript or you can write your last page in cookies and get the last link then update it
Using cookies will indeed fix this for you. So when a user goes to a new page - set a cookie like:
app.controller('myController',['$scope', '$location', $cookies], function($scope, $location, $cookies){
if($cookies.get('page') == '/index'){
//do stuff if user came from index
}
$scope.pageChanged = function(value){
$cookies.put('page', value);
$location.path('/index');
}
}
just make sure you use the pageChanged function to set your page every time user changes pages.
Using the $routeProvider you can use the resolve function to detect when a new route has been loaded.
Another way would be to listen for the event $routeChangeSuccessor $routeChangeError and get the information needed from the service $location or $route.
If you want a sample just ask me, I'll try to post one as soon as I have free time.
I'm developing a site in angular and suppose I have navigated to iphone detail page and its current url is "localhost:8080/iphone/details" .
Now I have to implement a new functionality of applying coupons.In this suppose user clicks on some hyperlink from external site,
"localhost:8080/iphone/details?promotionalCode=12345"
User will land on that page(page will load after that modal will pop up) and a modal pop's up . And here details of promo code i will fetch from query parameter.
But my requirement is if i click cross (dismiss modal) ,and modal closes and state of url should be changed to localhost:8080/iphone/details .
What i have done till now .
I have used $location.search().promocode to fetch promocode if this is valid than modal will pop up and on dismiss modal i'm calling function in which i'm resetting state using $window.location.href , but this is making the whole page getting refreshed. Any suggestion on this ?
You will need to use $location.search().
To get the query parameter ?promotionalCode=12345, you will need to do $location.search('promotionalCode',12345).
Please see: AngularJS Documentation for $location
You can use $stateProvider for this just give the state
Example: .state('app.page', {
url: 'iphone/details',
title: 'Coupon Applied', })
I am using $location.search(params) to store an array in my url. This array has determines how the page will load. It works well only problem is that I have a set of tabs on my page, when ever I click the the tab a new template is loaded with a new controller and the url variables disappear.
I dont understand this behavior $location.search() is not being called again in the new controller. How can I get the Url to stay static?
In the $routeProvider set reloadOnSearch: false so you don't reload when $location.search() changes.
https://docs.angularjs.org/api/ngRoute/provider/$routeProvider
Change the path using
$location.path('/differentRoute').search(params);
Doing so would change the route and set the search parameters again.