AngularJS instant URL loading

Question

this question may sound noob to geeks with ng-expert tag in their shirts.

I've been seeing some AngularJS-based sites that whenever I clicked a link, the URL changes but the browser does not load, it only loads dynamic content to their ng-view.

If current URL is http://www.sample.com/ and I clicked on Contact us link, the URL at my browser becomes http://www.sample.com/contact-us and so the page content changes like Ajax load but the browser does not load.

That thing is kind of new to me, can someone enlighten me about this? I've seen several tutorials but links are only hashtag-based (http://www.sample.com/#contactus) and not route based. I don't know what specific Angular concept it is so I don't know what to look for.

I'll greatly appreciate constructive solid answers. Thanks!

You can start by checking out the $location service, especially the part about "HTML5 mode". Do note that URL rewriting is required in the server-side to support this. — Nikos Paraskevopoulos
– Nikos Paraskevopoulos, Commented Oct 16, 2015 at 11:01
Thanks @NikosParaskevopoulos for that link reference. I have Laravel as back-end :) — Allen Linatoc
– Allen Linatoc, Commented Oct 16, 2015 at 11:12

Venkat · Accepted Answer · 2015-10-16 11:09:59Z

2

You can do routing with angular js without hash tags, by setting

   // use the HTML5 History API    
   $locationProvider.html5Mode(true);

so your browser url becomes http://www.sample.com/contact-us not http://www.sample.com/#contact-us

here is the complete tutorial blog, https://scotch.io/quick-tips/pretty-urls-in-angularjs-removing-the-hashtag

answered Oct 16, 2015 at 11:09

Venkat

644 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jelmer · Accepted Answer · 2015-10-16 11:11:55Z

1

You can change pages dynamically by changing the HTML on the main site or by $routeprovider

URL rewriting has to be supported by the server the site is hosted on. For this, look at: $location

answered Oct 16, 2015 at 11:11

Jelmer

1,0193 gold badges11 silver badges24 bronze badges

Collectives™ on Stack Overflow

AngularJS instant URL loading

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related