Question

这是我的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);
    }
]);

这是我的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>

我可以访问我的“代理”页面（人员列表），我的面包屑是正确的：主页/代理商

但是当我点击列表中的项目时，我总是得到相同的页面，但我的面包屑是正确的：主页/代理/ agentDetail

但是在app.router.js中，如果改变这样的细节：

var detail = { 名称：'root.detail'，//référencepriniale+ detail（fils） url：'/ agent / detail /：id'，//réfereprotiliséedansles fichiers HTML，关注c'est la suite de l'urlprécédente!!! 标题：'agentDetail'，//référenceutiliséepourle breadcump 观点：{ 'root.sidebar'：{templateUrl：“views / main.sidebar.html”}， 'root.container'：{templateUrl：“views / partials / agent / list.chantier.html”} } };

我得到了正确的页面（list.chantier.xml）但面包屑是假的：

home / agentDetail而不是home / agent / agentDetail

当我点击代理商列表页面的一个项目（list.container.html）时，我想得到正确的痕迹（home / agent / agentDetail）和正确的页面（list.chantier.html）

提前感谢您的帮助

Answer 1

将州重命名为＆＃39; root.detail＆＃39;您将详细状态附加到根状态。因此，拥有“家庭/代理商详情”是正常的。在面包屑中。

查看angular-breadcrumb模块。在有趣的功能（如面包屑标签中的插值）中，有一个option来更改状态的父级（仅用于面包屑）。

angular-ui-router：breadcrumbs ok但是查看ko

1 个答案: