CODEWITHSUNDEEP
angularjsurl-routingionic-framework
user3226932
user3226932

Reputation: 2222

Routing for Home Page and URL's for Website

I'm creating a website from multiple html files that are linked together with the ionic framework and am using AngularJS to transfer between states. I was wondering what the # means in a href and what role it plays in state transfer. If I have a href on a text like 

<a href="#/app/page2">hi</a>

is there a way to configure the url so that instead of saying localhost/index.html#/app/page2, it would just say localhost/index.html/page2 without the "#/app"? I've tried 

$locationProvider.html5Mode(true);

but it didn't work

Upvotes: 0

Views: 46

Answers (1)

levi
levi

Reputation: 22697

First, what means # in an url

Any URL that contains a # character is a fragment URL. The portion of the URL to the left of the # identifies a resource that can be downloaded by a browser and the portion on the right, known as the fragment identifier, specifies a location within the resource

Read more here -> source

Putting that in other words: the portion after # can be "served" without making a whole http request. In fact that portion after # is never sent in any http request.

By default angularjs works with # in the urls. It means that angular router will fetch urls only if they have #. Then in your controller, you can catch the request and fetch your required data using ajax.

http://example.com/#/about
http://example.com/#/contact

You can disable it by enabling html5mode, you can do it putting this in your router config:

$locationProvider.html5Mode(true);

So then your urls should looks like these and angular router should works fine.

http://example.com/about
http://example.com/contact

I would recommend not using # urls, is kinda old. My option is working using normal urls.

Upvotes: 2

Related Questions