在AngularJS UI-Router中更改导航状态

Question

我设置了一个相对简单的UI-Router，除了更改状态的导航本身就是一个ui视图。

主要HTML：

<header class="container__header">
    <nav class="container__header__tabs" ui-view="nav"></nav>
</header>

导航HTML：

<ul>
    <li class="nav-link active"><a ui-sref="/">all funds</a></li>
    <li class="nav-link"><a ui-sref=".something">something</a></li>
</ul>

问题是， .something链接无法在单击时更改状态视图。

我的AngularJS配置：

.state('home.something', {
        url: '/',
        views: {
            'nav': {templateUrl: 'templates/navs/explorer-nav.html'},
            'main': {templateUrl: 'templates/fund explorer/fund_explorer_all.html'}
        }       
});

这不会更改视图模板（尽管URL会更改）。 有任何想法吗？

Answer 1

问题出在<li class="nav-link"><a ui-sref=".something">something</a></li>

在这里，您将state用作.something ，但未在config定义。

更改为

<li class="nav-link"><a ui-sref="home.something">something</a></li>

它应该是home.something ，这意味着状态应该与config中定义的相同。

https://github.com/angular-ui/ui-router （检查-嵌套状态和视图）