Angular-ui-router With Html5mode Refresh Page Issue
Solution 1:
I'm not sure if this is going to solve your problem, but I had a very similar problem. First thing I had to do to use html5mode
was to use a rewrite property so the app would reload from the index file when i refresh the page, no matter what $state
I'm. This is the code I´m using, but it may be different, depending on the serverside you are using.
<IfModule mod_rewrite.c>
RewriteEngine On
#RewriteBase /relative/web/path/
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^(.+) - [PT,L]
RewriteCond %{REQUEST_URI} !=/favicon.ico
RewriteRule ^(.*) index.html
RewriteCond %{HTTP:Authorization} !^$
RewriteRule .* - [E=REMOTE_USER:%{HTTP:Authorization}]
</IfModule>
You can read more here, in the docs from ui-router
Also, you'd better set a base or not use a base for your app.
You either insert <base href="/" >
inside your head tag (or other base folder, depending on your structure).
Or you can use:
$locationProvider.html5Mode({enabled:true,requireBase:false});
So you don't have to use a base.
Also, you don't need a .run
to define a default state, ui-router
can do it with $urlRouterProvider.when
or $urlRouterProvider.otherwise
You can read more in the docs
Since I'm new user to Angular, this is just what i did to solve my problem, which was very similar to yours. Hope it can help you.
Solution 2:
I had the same issue, and I fixed it by adding this:
app.config(..., $urlMatcherFactoryProvider) {
$urlMatcherFactoryProvider.strictMode(false);
});
This is because my route was adding a trailing slash /
at the end of the paths and $stateProvider
was not recognizing the URL, thus taking me back to the home state.
Post a Comment for "Angular-ui-router With Html5mode Refresh Page Issue"