angular-ui-router : breadcrumps ok but view ko
- by anakin59490
this is my app.router.js :
agentRouter.config([
'$stateProvider',
'$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
var root = {
name: 'root',
abstract: true,
url: '',
title: 'home',
views: {
'header': { templateUrl: 'views/headers/header.app.html', controller: 'HeaderCtrl' },
'body': { templateUrl: "views/root.html" },
'footer': { templateUrl: 'views/footers/footer.app.html' }
}
};
var agent = {
name: 'root.agent',
url: '/agent',
title: 'agent',
views: {
'root.sidebar': { templateUrl: "views/main.sidebar.html" },
'root.container': { templateUrl: "views/partials/agent/list.container.html" }
}
};
var detail = {
name: 'root.agent.detail',
url: '/detail/:id',
title: 'agentDetail', // use for breadcrumb
views: {
'root.sidebar': { templateUrl: "views/main.sidebar.html" },
'root.container': { templateUrl: "views/partials/agent/list.chantier.html" }
}
};
/.../
$stateProvider.state(root);
$stateProvider.state(agent);
$stateProvider.state(detail);
}
]);
and this is my root.html :
<!--Breadcrumb content-->
<ul class="row breadcrumb">
<i class="glyphicon glyphicon-home" style=""></i>
<li ng-repeat="state in $state.$current.path">
<a ng-href="#{{state.url.format($stateParams)}}"><span ng-bind="state.title"></span></a>
<span ng-hide="$last" class=""></span>
</li>
</ul>
<!--Sidebar content-->
<div ui-view="root.sidebar">default root.sidebar</div>
<!--Container content-->
<div style="background-color: #f9f9f9" ui-view="root.container">default root.container</div>
I can access to my "agent" page (a list of person) and my breadcrumb is right : home / agent
but when i click on an item of the list i got always the same page but my breadcrumb is right :
home / agent / agentDetail
but in app.router.js if change detail like this :
var detail = {
name: 'root.detail', // référence initiale + detail (fils)
url: '/agent/detail/:id', // réference utilisée dans les fichiers HTML, attention c'est la suite de l'url précédente!!!
title: 'agentDetail', // référence utilisée pour le breadcump
views: {
'root.sidebar': { templateUrl: "views/main.sidebar.html" },
'root.container': { templateUrl: "views/partials/agent/list.chantier.html" }
}
};
i got the right page (list.chantier.xml) but the breadcrumb is false :
home / agentDetail instead of home / agent / agentDetail
I would like to got the right breadcrumb (home / agent / agentDetail) with the right page (list.chantier.html) when i click on an item of the agent list page (list.container.html)
Thank you in advance for your help
