Skip to content

Instantly share code, notes, and snippets.

@leocaseiro

leocaseiro/.htaccess

Last active February 23, 2022 03:59
Show Gist options
  • Star 14 You must be signed in to star a gist
  • Fork 6 You must be signed in to fork a gist
  • Save leocaseiro/4305e06948aa97e77c93 to your computer and use it in GitHub Desktop.
Save leocaseiro/4305e06948aa97e77c93 to your computer and use it in GitHub Desktop.
Download ZIP
Angular html5Mode apache working in a subdirectory /app using ngRoute
Raw
.htaccess
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) /app/index.html [NC,L]
</IfModule>
Raw
app.js
var app = angular.module('myApp', ['ngRoute'])
.config(function($routeProvider, $locationProvider) {
$routeProvider.when('/list',
{
templateUrl: 'templates/list.html',
controller: 'ListController'
});
$routeProvider.when('/new',
{
templateUrl: 'templates/new.html',
controller: 'EditController'
});
//Default URL
$routeProvider.otherwise({redirectTo:'list'});
//html5Mode don't need /app/#/ anymore, just /app/
$locationProvider.html5Mode(true).hashPrefix('!'); //the hashPrefix is for SEO
})
;
Raw
index.html
<!doctype html>
<html ng-app="myApp">
<head>
<meta charset="utf-8" />
<title>List</title>
<base href="/app/"><!-- Make sure the base is above your stylesheet -->
<meta name="fragment" content="!" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="css/app.css" />
</head>
<body>
<ng-view></ng-view>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-route.min.js"></script>
<script src="js/controllers/ListController.js"></script>
<script src="js/controllers/EditController.js"></script>
</body>
</html>
@lenichols
Copy link

Thanks for this... i was looking for dets on how to write my .htaccess file to work with angulars ugly hashed URLS.

@johhansantana
Copy link

awesome, thanks!

@vinnycrazzy
Copy link

Suuuper Awersomeeeee meaaan!

@ethanmay
Copy link

This is great! Thank you!

@royanon
Copy link

royanon commented Apr 19, 2018

sweet!

@amazejeewan
Copy link

Thank you it worked for me also.

@btd1337
Copy link

btd1337 commented Feb 23, 2022

@leocaseiro What to do to work in subroutes?

# Refresh works
app.com/route-a

# Refresh don't work
app.com/child-route/route-b

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment