Page refresh redirects to home page - angularjs

Question

I have created a form in angularjs. I has four pages like information, education, experience and privacy. while filling the details in education if the page is refreshed it redirects to information that is starting page of the form. If the page is refreshed I want to stay in current page. Give me any suggestion. My routing code given below
(function() {
"use strict";
xyz.config(['$stateProvider',
function ($stateProvider) {
'use strict';
$stateProvider
.state('xyz.basicInfo', {
url: '/Information',
views: {
'Form': {
title: "Information", 
templateUrl: '../views/information.html',
controller: 'InformationController'
}
},
resolve: {
loadFile: ['$ocLazyLoad', function($ocLazyLoad) {
return $ocLazyLoad.load(['intlTelInput']);
}]
}
})
.state('xyz.education', {
url: '/education',
views: {
'Form': {
title: "Education",
templateUrl: '../views/education.html',
controller: 'educationController'
}
}
})
}])
}).call(this);

Answer 1

This kind of issue is typically a web server issue. Angular apps are Single Page Apps (SPAs) so any request for an HTML file, regardless of path, should serve up index.html (index.html being the single page)
If for example, your route is /my/route and you refresh the web server, by default, will try to serve up index.html inside a folder called /my/route
So you need to override this default behaviour such that your webserver always servers the root index.html and then your routes will work as expected.
How to do this depends on your web server - if its a node server, apache, nginx, webpack-dev-server, etc
Heres a thread talking about how to do this on Apache ... https://askubuntu.com/questions/484986/how-do-i-make-apache-serve-a-single-static-page-no-matter-what-the-entered-url-i