How to refresh (F5) and get another page using AngularJS?

Question

In my web application, I got the form on two different pages, purchase1 and purchase2 .

If the customer refreshes the page in purchase2 , I want the location to be changed to purchase1 .

I did not find a way to do this, I tried to make such a configuration:

 .config(function($stateProvider, $urlRouterProvider) { $urlRouterProvider.when('/purchase2', '/purchase1'); } 

But, obviously, this way I can never get to the purchase2 page.

I need this to happen only when updating manually.

Is there any way to do this? Some built-in Angular function that appears when updating?

Sort of

 $scope.onRefresh = function(){ $location.path('/dashboard/purchase1'); } 

We did not find anything like it.

Answer 1

In the end, if anyone is interested, I fixed it like this:

In purchase1.js, I added this to the submit () function:

 $rootscope.demographic=1; 

In purchase2.js, I added this code to the controller:

 var init = function(){ if(angular.isUndefined($rootScope.demographic)){ $location.path('/purchase1'); } }; init(); 

It works because Refresh (F5) completely restarts the application, therefore it also resets the root $ directory and makes it "Demographic" Undefined.

After entering purchase2, the "init" function will start, if we came from purchase1, everything will be fine, and demographics will be determined, otherwise we will just load purchase1 again.

:)

Answer 2

You can listen to the beforeunload event. The beforeunload event will fire when someone hits F5 or refreshes the page anyway. Do something like

 var windowElement = angular.element($window); windowElement.on('beforeunload', function (event) { event.preventDefault(); //below is the redirect part. $window.location.href = '/purchase1'; }); 

Put this code on the purchase2 page.

Answer 3

Yes you can do it.

Register a global listener to change state:

 $scope.$on('$stateChangeStart', function(event, toState, toParams, fromState) { // If fromState is null that means it is a page refresh otherwise // The fromState will be the purchase1 if (toState.name == 'purchase2' && !fromState) { $state.go('purchase1'); event.preventDefault(); return; } }); 

In the global, I mean registering above in such a controller, the volume of which is available throughout the application, for example, the controller is added to the body or html tag.

Also, I assume that purchase1 and purchase2 is the name of your states for both pages. If they are general state parameters, you can change the code above.

Answer 4

What happens during the upgrade is the same as during the first boot.

What you can do is check if the user was already here, for example. setting the cookie and reading it later.

However, I think you should reconsider your design. Why did you spend your time improving the update?

Answer 5

I think javascript is not suitable, because javascript does not know anything about the previous page, because it will be displayed when the page is already loaded. Therefore, try checking this in your server application, for example, in php or jsp, and read the request header, because there you can get the current url and redirect the user to a new URL

Answer 6

You can try to set the flag localStorage and save this variable in localStorage . Then you can write IIFE, which will check the value of this variable and redirect to purchase1.

Also when buying1, reset to false .

Note. This is pure JS code and uses localStorage.

Fiddle

Code example

 (function(){ var isPurchase2Loaded = localStorage.getItem("Purchase2"); if(isPurchase2Loaded || isPurchase2Loaded === undefined){ document.write("Rerouting to purchase 1..."); } else{ document.write("Loading for the first Time..."); localStorage.setItem("Purchase2", true); } })() 

Answer 7

 $state.go('purchase1'); 

this should solve your problem.