Rohit Rane
Rohit Rane

Reputation: 2940

Changing Angular UI router app root from "#" to something else

When I implement angular UI router in my app, my view URL appears as :

www.example.com/serverpath#/UIRouterPath1
www.example.com/serverpath#/UIRouterPath2

Now I want to change to something like

www.example.com/serverpath/SPA/UIRouterPath1
www.example.com/serverpath/SPA/UIRouterPath2

How do I accomplish this?

Upvotes: 0

Views: 190

Answers (1)

Victor de Andres
Victor de Andres

Reputation: 68

By default, AngularJS will route URLs with a hashtag, but you can remove it with $locationProvider.

You will use the $locationProvider module and set html5Mode to true. For example:

var app = angular.module('App', ['ngRoute']);

app.config(function($routeProvider,  $locationProvider){
    $locationProvider.html5Mode(true);

And for add a base to url in your index file you must use <base> tag in the head section. For example

<base href="/SPA">

In this way when you write one <a> tag like this in your html file:

<a href="UIRouterPath1">UIRouterPath1</a>

it will be linked to: www.example.com/serverpath/SPA/UIRouterPath1

Upvotes: 1

Related Questions