CODEWITHSUNDEEP
javascriptangularjsangular-routing
Kgn-web
Kgn-web

Reputation: 7555

How to do nested routing using one template & controller in angularjs?

I have a main template main.html, now I have say few links in this page.

  `<a href="albums/bollywood">bollywood </a>`
  <a href="albums/tollywood">tollywood </a>

Now in turn this page again have links as <a href="album/bollywood/hindi/old"> Old </a>

And chains goes on.

Now what I want is every url has one template to render. I want to have one configration as:-

`$routeProvider(when('/albums/:albumName),
 {
     templateUrl : 'albumsList.html',
     controller : 'albumsCtrl'
 })`

I want to specify that whateveer follows /albums/* , using $routeParams collect that value in albumName.

In my scenario,I don't see any need to need to use ui-routes.

Upvotes: 2

Views: 37

Answers (1)

Vishal Khode
Vishal Khode

Reputation: 841

You need to use * in $routeProvider that will match all the characters in the url, when : is used it will match all characters till /.

Change your code

$routeProvider(
when('/albums/:albumName),
 {
     templateUrl : 'albumsList.html',
     controller : 'albumsCtrl'
 })

To

$routeProvider(
when('/albums/:albumName*),
 {
     templateUrl : 'albumsList.html',
     controller : 'albumsCtrl'
 })

Reference: https://docs.angularjs.org/api/ngRoute/provider/$routeProvider

Upvotes: 2

Related Questions