Clean URLs for Angularjs - angularjs

Question

I'm trying to use clean url routing for my web app but everything I try doesnt work. Here is my app.js. Im not to sure how the location provider should be added in to the app.js but everything I try produces a 404. Please could someone point me in the right direction?
.config(function($stateProvider, $urlRouterProvider) {
//Enable cross domain calls
$stateProvider
.state('main', {
url: '/',
templateUrl: 'views/main.html',
controller: 'MainCtrl',
controllerAs: 'vm'
})
.state('about', {
url: '/about',
templateUrl: 'views/about.html',
controller: 'AboutCtrl',
controllerAs: 'vm'
})
.state('blog', {
url: '/blog',
templateUrl: 'views/blog.html',
controller: 'BlogCtrl',
controllerAs: 'vm'
})
.state('corparate', {
url: '/corparate',
templateUrl: 'views/corparate.html',
controller: 'CorparateCtrl',
controllerAs: 'vm'
})
.state('contact', {
url: '/contact',
templateUrl: 'views/contact.html',
controller: 'ContactCtrl',
controllerAs: 'vm'
})
.state('login', {
url: '/login',
templateUrl: 'views/login.html',
controller: 'RegisterationCtrl',
controllerAs: 'vm'
})
.state('register', {
url: '/register',
templateUrl: 'views/register.html',
controller: 'RegisterationCtrl',
controllerAs: 'vm'
})
.state('dashboard', {
url: '/dashboard',
templateUrl: 'views/dashboard.html',
controller: 'DashboardCtrl',
controllerAs: 'vm'
})
.state('useredit', {
url: '/settings',
templateUrl: 'views/useredit.html',
controller: 'UserEditCtrl',
controllerAs: 'vm'
})
.state('friendlist', {
url: '/search',
templateUrl: 'views/friendlist.html',
controller: 'FriendListCtrl',
controllerAs: 'vm'
})
.state('friendprofile', {
url: '/profile/:userName',
templateUrl: 'views/friendprofile.html',
controller: 'FriendProfileCtrl',
controllerAs: 'vm'
})
.state('resetPassword', {
url: '/resetPassword',
templateUrl: 'views/resetPassword.html',
controller: 'ResetPasswordCtrl',
controllerAs: 'vm'
});
$urlRouterProvider.otherwise(function ($injector, $location) {
var $state = $injector.get("$state");
$state.go("main");
});
})
.run(function ($rootScope, $state, ParseApi) {
$rootScope.$on('$stateChangeStart', function (event, next) {
if (!ParseApi.isAuthenticated()) {
if (next.name !== 'register' && next.name !== 'login' && next.name !== 'resetPassword' && next.name !== 'friendlist' && next.name !== 'friendprofile') {
event.preventDefault();
$state.go('login');
}
}
});
})
})();