i don't know i'm doing wrong, here's want.
to begin with, here's body:
<body> <div ng-app="testapp" ng-controller="maincontroller" class="container-fluid"> <div ui-view class="row"></div> </div> </body>
now, inside ui-view, want content depending on url. first, there home state contain other states.
- home - recent studies - studies - map - study
to so, i'm trying create hierarchy of routes. home template (home.html), abstract one, go in ui-view
above:
<div ng-controller="homecontroller"> <header> <div class="row"> <div class="col-xs-6">test web application</div> <div class="col-xs-6"> <p class="pull-right">bonjour <strong>{{currentaccount.name}}</strong> ! <a href="#">déconnexion</a></p> </div> </div> </header> <article class="row"> <div ui-view></div> </article> </div>
here's recent studies (home.recentstudies.html.twig), want put inside ui-view of home.html:
<p>recent studies</p>
here routes definition:
angular.module('testapp').config(['$stateprovider', '$urlrouterprovider', function($stateprovider, $urlrouterprovider) { $urlrouterprovider.otherwise('/recentstudies'); $stateprovider .state('home', { url: '/', abstract: true, templateurl: 'partials/home.html' }) .state('home.recentstudies', { url: '/recentstudies', templateurl: 'partials/home.recentstudies.html' }) .state('home.studies', { url: '/studies', templateurl: 'partials/studies.html' }) ; }]);
my problem when load application, blank , don't seem understand problem.
it doesn't seem can't use templateurl in plnkr transferred code template directly:
the point combination of parent , child url. work
$urlrouterprovider.otherwise('//recentstudies');
check here
why? because url of child state, build ancestors. 'home' state has url url: '/',
, child 'home.recentstudies' has url: '/recentstudies',
that means - complete url contact of these === '//recentstudies'
but not best way go. can use reset on child:
.state('home.recentstudies', { url: '^/recentstudies', ... $urlrouterprovider.otherwise('/recentstudies');
and original default stuff work. check here
check doc:
absolute routes (^)
if want have absolute url matching, need prefix url string special symbol '^'.
$stateprovider .state('contacts', { url: '/contacts', ... }) .state('contacts.list', { url: '^/list', ... });
Comments
Post a Comment