How to select different template depending on different angular js route value

Question

I have a route like this:

$routeProvider.when('/test/item/:item', {
            templateUrl: '/test/test.html'
            , controller: 'TestController'
        });

Now I want to load different templateUrl depending on different :item value, How do I do it in angularJS?

for example:

$routeProvider.when('/test/item/:1', {
            templateUrl: '/test/test1.html'
            , controller: 'TestController'
        });
$routeProvider.when('/test/item/:2', {
            templateUrl: '/test/test2.html'
            , controller: 'TestController'
        });

Thanks in advance.

PSL · Accepted Answer · 2015-01-21 18:16:11Z

3

templateUrl can be a function as well and you get the first argument will be route params:

So you can do something like this:-

  $routeProvider.when('/test/item/:item', {
        templateUrl: function(param){
          return '/test/test' + param.name + '.html'
          /*if(param.name === 'somevalue'){
            return someurl;
          }
          return someotherurl;*/
        }
        , controller: 'TestController'
    });

templateUrl – {string=|function()=} – path or function that returns a path to an html template that should be used by ngView.

If templateUrl is a function, it will be called with the following parameters:

{Array.} - route parameters extracted from the current $location.path() by applying the current route

answered Jan 21, 2015 at 18:16

PSL

124k21 gold badges257 silver badges243 bronze badges

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

Collectives™ on Stack Overflow

How to select different template depending on different angular js route value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related