javascript - Angular ui-router nested view -
im trying inject nested view normal view, using ui-router. know it's possible doing ng-include. want solve using ui-router.
my html follow:
<div class="row"> <div class="col-md-12"> <div class="panel panel-default"> <div class="panel-heading">project todos</div> <div class="panel-body"> <div ui-view="todos"></div> </div> </div> </div> </div>
then in script got state:
.state('project', { url: '/project/:projectid', templateurl: 'views/project/project.html', controller: 'projectctrl', views: { 'todos': { templateurl: 'views/project/todos.html' } } })
update - isn't there possible?
.state('project', { url: '/project/:projectid', templateurl: 'views/project/project.html', controller: 'projectctrl', views: { 'todos@project': { templateurl: 'views/project/todos.html' } } })
anyone can find typo or something? i've read docs. not sure what's wrong.
thanks in advance!
there working plunker, showing how can make running
on index.htm need have <div ui-view="" ></div>
, place inject project.html. adjust state definition, inject nested view - using ui-view
absolute naming:
.state('project', { url: '/project/:projectid', views: { '' : { templateurl: 'views.project.project.html', controller: 'projectctrl', }, 'todos@project': { templateurl: 'views.project.todos.html' } } });
the absolute name todos@project
, inject todos.html project.html. check plunker
see the:
a cite:
...behind scenes, every view gets assigned absolute name follows scheme of
viewname@statename
, viewname name used in view directive , state name state's absolute name, e.g. contact.item. can choose write view names in absolute syntax...
Comments
Post a Comment