Arun Arun - 1 year ago 334
AngularJS Question

dynamic change of templateUrl in ui-router from one state to another


<a ui-sref="{provider:})" target="_blank">{{}}</a>

Above code is in ng-repeat with many template links loaded with name and id so when i click each link , href will be updated with id number appended to selected template link. I am generating about ten templates with same controller. I am passing value in ui-sref from one state to another so i need dynamic templateUrl,
i tried this link issue but i cant able to send stateparams since the main template page has no params.

Here the ui router code in app.js

url: '/template',
templateUrl: './views/tools/select-template.html',
controller: 'selectTplCtrl',
controllerUrl: 'tools/selecttplCtrl'

url: '/selectedTemplate/:provider',
templateUrl: function($stateParams){
return './views/tools/selected-template'+'$stateParams.provider'+'.html'
controller: 'selectedTemplateCtrl',
controllerUrl: 'tools/selectedTemplateCtrl'

Can anyone solve this issue ?

Answer Source

I would say that you are on the right track.. just URL construction should be adjusted like this:

templateUrl: function($stateParams){
    //return './views/tools/selected-template'+'$stateParams.provider'+'.html'
    return './views/tools/selected-template'+ $stateParams.provider +'.html'

See more here, what we can have with UI-Router when working with dynamic template link:

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download