javascript - angularjs using variables in templateUrl -

i'm trying use $scope in templateurl this:

app.config(['$routeprovider', function ($routeprovider) {     $routeprovider.         when('/blog', {                 templateurl: 'themes/{{ mainctrl.site_theme }}/view/home.html',                 controller: 'blogmain',         }).         otherwise({             redirectto: '/blog'         }) }]); 

when trying use:

root/themes/<theme_name>/view/home.html template file. gives me error get http://www.url.com/themes/%7b%7b%20mainctrl.site_theme%20%7d%7d/view/home.html 404 (not found)

note: works fine if type theme name normally

any appreciated :d in advance

option one

you can set variable (in case theme name) in url , access in routes:

.when('/blog/:themename', {      templateurl: function(params) {          return 'themes/'+ params.themename +'/view/home.html',      } 

this less suited situation though isn't ideal passing theme name via url. i'd recommend option two...

option two

you can use provider allow setting of theme name:

app.provider('themeconfig', function() {     this.name = 'default';     this.$get = function() {         var name = this.name;         return name;     };     this.setname = function(name) {         this.name = name;     }; }); 

you can inject provider application config, set theme , use in routes.

app.config(['$routeprovider', 'themeconfigprovider',     function ($routeprovider, themeconfigprovider) {        themeconfigprovider.setname('mytheme');        $routeprovider           .when( '/this', { templateurl: themeconfigprovider.name + '-this.html' })           .when( '/that', { templateurl: themeconfigprovider.name +'-that.html' })           .when( '/other', { templateurl: themeconfigprovider.name +'-other.html' })           .otherwise( { redirectto: '/this' }); }]); 

working jsfiddle here: http://jsfiddle.net/3b5sk/