angularjs - Angular UI-router and using dynamic templates -


i'm trying load template file using rootscope value it's name. have init controller sets $rootscope.template "whatever.html", have route this:

$stateprovider.state('/', {   url: '/',   access: 'public',   views: {     page: {       controller: 'homectrl',       templateprovider: function($templatefactory, $rootscope) {         return $templatefactory.fromurl('/templates/' + $rootscope.template);       }     }   } }); 

but doesn't work. freezes whole chrome have kill process in order stop it... i've tried templateurl no results.

so how use dynamic template file ui-router?

similiar other question (in order found them): angular , ui-router, how set dynamic templateurl, created a working plunker show how to. how work?

so, if state call:

<a href="#/parent/child/1">#/parent/child/1</a> <a href="#/parent/child/2">#/parent/child/2</a> 

and these states:

  $stateprovider     .state('parent', {       url: '/parent',       //abstract: true,       templateurl: 'views.parentview.html',       controller: function($scope) {},     });    $stateprovider     .state('parent.child', {       url: '/child/:someswitch',       views: {          // see more below 

then can use templateprovider definiton:

templateprovider: function($http, $stateparams, getname) {      // async service template name db     return getname         .get($stateparams.someswitch)         // have name         .then(function(obj){            return $http               // let's ask template               .get(obj.templatename)               .then(function(tpl){                   // haleluja... return template                   return tpl.data;            });               })  },  

what can see chaining of async results:

// first return of promise return asyncstuff   .then(function(x){     // second return of promise once done first     return asyncstuff       .then(function(y){          // again           return asyncstuff           .then(function(z){             return ...           }       }    } 

and that's magical templateprovider can us... wait until promises resolved , continue execution known template name , content. check example here. more template provider: angular ui router: decide child state template on basis of parent resolved object


Comments

Popular posts from this blog

c++ - QTextObjectInterface with Qml TextEdit (QQuickTextEdit) -

javascript - angular ng-required radio button not toggling required off in firefox 33, OK in chrome -

xcode - Swift Playground - Files are not readable -