Question

我创建了一个导航栏，当用户点击与当前状态相对应的链接时，没有任何反应。例如，您在/about，然后点击关于那个有href="/about"的链接。菜单保持打开状态。如果您点击另一个链接（例如，不同的状态），它就会起作用。

我在某处读到如果当前状态与目标状态相同则忽略状态转换。我甚至想知道状态转换是否已经开始，因为该位置没有改变。

menuItem.link引用常规URI，例如/，/contact或/about。

<div class="btn-group" dropdown is-open="status.isopen" ng-repeat="menu in menuModel">
    <button type="button" class="btn btn-primary dropdown-toggle">
        {{menu.text}} <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" role="menu">
        <li ng-repeat="menuItem in menu.items"><a href="{{menuItem.link}}">{{menuItem.text}}</a></li>
    </ul>
</div>

我猜菜单保持打开状态，因为没有发生转换。有没有办法强制过渡，即使它处于同一状态？

Answer 1

尝试将网址更改为＆＃34; #/about＆＃34; .. Angular UI路由器默认添加＆＃34; #＆＃34;在URL前面

如果这不起作用，请使用它来检测发生了什么：

$scope.$on('$stateChangeStart', function(evt, toState, toParams, fromState, fromParams) {
     console.log("To state is"+toState.name+", From State is "+fromState.name);
  });

您可以查看状态更改是否已开始。

编辑：

如果您想检查状态更改未发生的原因，请使用以下代码段：

 $rootScope.$on('$stateChangeError',
   function (event, toState, toParams, fromState, fromParams, error) {
     console.log('$stateChangeError', event, toState, toParams, fromState, fromParams, error);
  });

编辑 - 解决方案：当您在/about中，然后href为/about时，UI路由器会查找有关您/您所在州内的子状态。你想要的是URL读取＆＃34;。＆＃34;只是点代表当前状态。如果您想要更好的实现，而不是使用href，您可以使用ui-sref=".about" ..例如。 <a ui-sref="home">Home</a> | <a ui-sref="about">About</a> UI路由器将自动生成相关的href，这也可以解决您的问题。

正如您在评论中正确提到的那样，您可能还需要添加其他参数 - 更多详细信息：http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.directive:ui-sref

Angular JS - Angular UI路由器 - 根据位置监视重新加载当前状态

1 个答案: