AngularJS $routeProvider is there a shorthand way of having multiple routes with same settings?

Issue

I have both routes leading to the same view and controller (i.e. I’m just passing in an id to access in $routeParams and performing controller logic on it):

$routeProvider
        .when('/about',
        {
            controller: 'AboutController',
            controllerAs: 'vm',
            templateUrl: 'about.html'
        })
        .when('/about/:id',
        {
            controller: 'AboutController',
            controllerAs: 'vm',
            templateUrl: 'about.html'
        });

This feels very repetitive. Is there any shorthand, something like this?

$routeProvider
            .when(['/about', '/about/:id'],
            {
                controller: 'AboutController',
                controllerAs: 'vm',
                templateUrl: 'about.html'
            })

Solution

From $routeProvider source code, it seems to me that it is not possible. this.when method accepts two parameters, path and route. For multiple path, this.when should either accept array of path as parameter, or extract multiple paths from single string. I don’t see any of these two in this method.

this.when = function(path, route) {
    //copy original route object to preserve params inherited from proto chain
    var routeCopy = angular.copy(route);
    if (angular.isUndefined(routeCopy.reloadOnSearch)) {
      routeCopy.reloadOnSearch = true;
    }
    if (angular.isUndefined(routeCopy.caseInsensitiveMatch)) {
      routeCopy.caseInsensitiveMatch = this.caseInsensitiveMatch;
    }
    routes[path] = angular.extend(
      routeCopy,
      path && pathRegExp(path, routeCopy)
    );

    // create redirection for trailing slashes
    if (path) {
      var redirectPath = (path[path.length - 1] === '/')
            ? path.substr(0, path.length - 1)
            : path + '/';

      routes[redirectPath] = angular.extend(
        {redirectTo: path},
        pathRegExp(redirectPath, routeCopy)
      );
    }

    return this;
  };

Answered By – Khalid Hussain

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published