Clever Geek Handbook

Angular JS links in hash mode not behaving correctly

Having some problems with links on my page in angular app.

So, just a quick overview:

  • I have html 5 mode disabled

  • here's my routing setup

      $routeProvider
    .when('/',{
      templateUrl: '/views/search.html',
      controller : 'SearchCtrl'
    })
.when('/result',{
  templateUrl: '/views/result.html',
  controller : 'resultCtrl'
})
.when('/no-result',{
  templateUrl: '/views/no-result.html',
  controller : 'noResultCtrl'
})
.otherwise({
  redirectTo: '/'
});

    $ locationProvider.html5Mode (false);

The problem I found is the behavior of the URL

  • If I just typed my domain, the page is loaded to the following url

Domain / # and view is loading correctly and loading controller as well

  • But then let's say that I have an href on my page. I want to link to the home page.

Properly

<a ng-href="/" class="link-dark">Link </a>

it changes url to Domain / # but view and controller are not loaded.

but if i change url to

<a ng-href="/#/" class="link-dark">Link </a>

it loads correctly.

Is this normal behavior, something just seems?

+3


source to share


3 answers


This is normal behavior. If you are using something like Angular Ui-router you can actually use state without having to use # signs.



0


source


Use Angular Ui Router .. Which solves your problem without any extra effort and gives many other routing features.



0


source


Here is a great article explaining how angular routing using hashbang (#) works. http://sidazad.tumblr.com/post/92336467073/demystifying-angularjs-routing-html5-and

You will see that yes, this is normal behavior.

To do a little bit of work, I will say that you can configure angular to remove the hashbang, but I would recommend that you save it if you want to be able to navigate to any page in your application by URL. If you decide to remove this hash node, for example, you will need to add an endpoint on your server that will return the main page of your application for each call to the URL, for example "/ something" instead of "/ # / something". Feel free to ask if I am not enough.

0


source






More articles:


All Articles