Signup/Sign In
Ask Question
Not satisfied by the Answer? Still looking for a better solution?

Reloading the page gives wrong GET request with AngularJS HTML5 mode

I want to enable HTML5 mode for my app. I have put the following code for the configuration.
return app.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider) {

$locationProvider.html5Mode(true);
$locationProvider.hashPrefix = '!';

$routeProvider.when('/', {
templateUrl: '/views/index.html',
controller: 'indexCtrl'
});
$routeProvider.when('/about',{
templateUrl: '/views/about.html',
controller: 'AboutCtrl'
});


As you can see, I used the ^^$locationProvider.html5mode and I changed all my links at the ng-href* to exclude the /#/.

*The Problem


How can I enable angular to get the correct page when I refresh?
by

1 Answer

vishaljlf39
There are few things to set up so your link in the browser will look like ://yourdomain.com/path and these are your angular config + server side

1) AngularJS*
$routeProvider
.when('/path', {
templateUrl: 'path.html',
});
$locationProvider
.html5Mode(true);

*2) server side,* put .htaccess inside your root folder and paste this
RewriteEngine On 
Options FollowSymLinks

RewriteBase /

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.
)$ /#/$1 [L]

Login / Signup to Answer the Question.