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.
Related
Setting:
I have an angular app.
What I have:
I have this: ui-sref="providerDetail({id:provider.id})" functioning.
It is a functioning link to a page giving details on a given provider.
What I want:
I have a button that submits a form and makes a new provider. This works. But I also want this button to forward the user to that new provider's detail page.
I have a function running that prints the id of the new provider to the console when it is made, I just can't figure out how to forward the user to the appropirate location.
Note:
I can add this to the function:
window.location = "/dashboard.html#!/providerDetail/" +id;
And it will take me to the new page, but I get this impression that this is a bad route to take.
Don't manually change the URL in AngularJS application, do it in Angular way so that you don't need to worry about manually kick of digest cycle. From function you could call $state.go method to navigate between states.
function myFunction(id) {
$state.go('providerDetail', { id: id})
}
Note: Please make sure you inject $state inside you controller.
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");
});
}
Any time I make changes to the code in my angularjs site, they do take effect until the user clicks the refresh button. Even if I log out to a page that is not angular then log back in it is the same old code until I click the refresh button. So if someone logs in it is the same as the last time they logged in regardless of changes and I obviously can't expect them to click refresh every time they log in.
So my question is how could I force a refresh of the code. I don't want to use window.reload or anything like that if there is a speacial angular way to accomplish this. I have tried clearing the template cache but it doesn't work. This is what I tried:
.run(function($rootScope, $templateCache) {
$templateCache.removeAll();
$rootScope.$on('$routeChangeStart', function(event, next, current) {
if (typeof(current) !== 'undefined'){
$templateCache.remove(current.templateUrl);
}
});
})
My problem turn out to be the browser caching js files. I didn't think that would be the problem because prior to using angularjs I never had this problem. So to fix the issue I found this: How to force browser to reload cached CSS/JS files? and modified it a little so I didnt have to use all the url rewriting.
I added the php function
function get_version($file){
return filemtime($_SERVER['DOCUMENT_ROOT'] . $file);
}
Then where I link my scripts I use:
<script src="/path/to/script.js?<?php echo get_version('/path/to/script.js');?>"></script>
I'm using email/password for an app. When I register a user, they choose a username and it binds to a $rootScope variable called authUser.
I then use it in a divbar at the top that indicates that they're logged in as so:
<span>welcome {{authUser}}</span>
This works fine and their chosen username binds to it after they register, as I bind their username to the variable in a callback.
However, when I hard reload the page, it doesn't bind anymore. It seems like it takes a moment for the page to recognize that the user is logged in,
And by that time, angular has already run through its $apply cycle and the only thing I see on the navbar is "welcome".
Is there a way to know at what point (after a hard page reload) the logged in user is recognized? If possible, I'd like to chain some sort of callback or .then() function to bind or apply $rootScope.authUser then.
I guess this may be somewhat related to an asynchronous call, where the data must be used with a promise to guarantee success.
Any tips on this would be appreciated. Ill have access to my source code in about an hour if you need specific details but I think this problem may be more conceptual than about actual code implementation.
Thanks a bunch SO!
If you want to get notified when the user logs in you can register an event listener like this:
$rootScope.$on("$firebaseSimpleLogin:login", function(e, user) {
});
If you just want to know whether the login state has been initialized then you can use $getCurrentUser():
var auth = $firebaseSimpleLogin(this.dbRef);
$scope.loginStateDetermined = false;
auth.$getCurrentUser().then(function (user) {
$scope.loginStateDetermined = true;
});
Checkout the docs for more info:
login-related-events
$getCurrentUser()
I'm currently trying to figure out how to change the route parameters without reloading the entire page. For example, if I start at
http://www.example.com/#/page
but update a name to be 'George', to change the route to be:
http://www.example.com/#/page/george
If I already had http://www.example.com/#/page/:name routed.
Without reloading the location. Can one just set $routeParams.name = "George" ?
Edit:
Alternatively, is there a way to update http://www.example.com/#/page?name=George without reloading or resetting the page?
Ok, after a lot of searching. I answered my own question.
I've discovered finding anything on the angular documentation is incredibly impossible, but sometimes, once it's found, it changes how you were thinking about your problem.
I began here: http://docs.angularjs.org/api/ng.$location
Which took me here: http://docs.angularjs.org/guide/dev_guide.services.$location
Which took me to this question: AngularJS Paging with $location.path but no ngView reload
What I ended up doing:
I added $location.search({name: 'George'}); To where I wanted to change the name (A $scope.$watch).
However, this will still reload the page, unless you do what is in that bottom StackOverflow link and add a parameter to the object you pass into $routeProvider.when. In my case, it looked like: $routeProvider.when('/page', {controller: 'MyCtrl', templateUrl:'path/to/template', reloadOnSearch:false}).
I hope this saves someone else a headache.
I actually found a solution that I find a little more elegant for my application.
The $locationChangeSuccess event is a bit of a brute force approach, but I found that checking the path allows us to avoid page reloads when the route path template is unchanged, but reloads the page when switching to a different route template:
var lastRoute = $route.current;
$scope.$on('$locationChangeSuccess', function (event) {
if (lastRoute.$$route.originalPath === $route.current.$$route.originalPath) {
$route.current = lastRoute;
}
});
Adding that code to a particular controller makes the reloading more intelligent.
You can change the display of the page using ng-show and ng-hide, these transitions won't reload the page. But I think the problem you're trying to solve is you want to be able to bookmark the page, be able to press refresh and get the page you want.
I'd suggest implementing angular ui-router Which is great for switching between states without reloading the page. The only downfall is you have to change all your routes.
Check it out here theres a great demo.