AngularJS: ngRoute Not Working

It’s properly because you are using angular 1.6 and there has been a change the default hash-prefix: Due to aa077e8, the default hash-prefix used for $location hash-bang URLs has changed from the empty string (”) to the bang (‘!’). If your application does not use HTML5 mode or is being run on browsers that do … Read more

Angular 1 – get current URL parameters

To get parameters from URL with ngRoute . It means that you will need to include angular-route.js in your application as a dependency. More information how to do this on official ngRoute documentation. The solution for the question: // You need to add ‘ngRoute’ as a dependency in your app angular.module(‘ngApp’, [‘ngRoute’]) .config(function ($routeProvider, $locationProvider) … Read more

AngularJS routing 404 error with HTML5 mode

HTML5 mode requires URL rewriting. From the Docs: HTML5 Mode Server side Using this mode requires URL rewriting on server side, basically you have to rewrite all your links to entry point of your application (e.g. index.html). Requiring a <base> tag is also important for this case, as it allows AngularJS to differentiate between the … Read more

What’s the most concise way to read query parameters in AngularJS?

You can inject $routeParams (requires ngRoute) into your controller. Here’s an example from the docs: // Given: // URL: http://server.com/index.html#/Chapter/1/Section/2?search=moby // Route: /Chapter/:chapterId/Section/:sectionId // // Then $routeParams ==> {chapterId:1, sectionId:2, search:’moby’} EDIT: You can also get and set query parameters with the $location service (available in ng), particularly its search method: $location.search(). $routeParams are less … Read more

Redirecting to a certain route based on condition

After some diving through some documentation and source code, I think I got it working. Perhaps this will be useful for someone else? I added the following to my module configuration: angular.module(…) .config( [‘$routeProvider’, function($routeProvider) {…}] ) .run( function($rootScope, $location) { // register listener to watch route changes $rootScope.$on( “$routeChangeStart”, function(event, next, current) { if … Read more

angularjs 1.6.0 (latest now) routes not working

Simply use hashbang #! in the href: <a href=”#!/add-quote”>Add Quote</a> Due to aa077e8, the default hash-prefix used for $location hash-bang URLs has changed from the empty string (”) to the bang (‘!’). If you actually want to have no hash-prefix, then you can restore the previous behavior by adding a configuration block to your application: … Read more

Removing the fragment identifier from AngularJS urls (# symbol)

Yes, you should configure $locationProvider and set html5Mode to true: angular.module(‘phonecat’, []). config([‘$routeProvider’, ‘$locationProvider’, function($routeProvider, $locationProvider) { $routeProvider. when(‘/phones’, {templateUrl: ‘partials/phone-list.html’, controller: PhoneListCtrl}). when(‘/phones/:phoneId’, {templateUrl: ‘partials/phone-detail.html’, controller: PhoneDetailCtrl}). otherwise({redirectTo: ‘/phones’}); $locationProvider.html5Mode(true); }]);