AngularJS - 创建动态通用标头

时间:2014-02-17 15:48:52

标签: angularjs

在我的AngularJS应用程序中,我使用的是带有ng-view指令的路由器。

除此之外,我想添加一个通用标题(所有视图都相同)。所以我做了以下事情:

<!-- index.html -->
<body ng-app="myApp">
    ...
    <div ng-controller="TopmenuCtrl" class="header">
        <div ng-include="template.url"></div>
        ...
    </div>

    <div ng-view></div>
</body>

视图是动态的,具体取决于会话令牌:

<!-- views/topmenu.html -->
<ul class="nav nav-pills pull-right">
  <li class="active"><a ng-href="#">Home</a></li>
  <li><a ng-href="#">About</a></li>
  <li><a ng-href="#">Contact</a></li>
  <li ng-show="token"><a ng-href="#" ng-click="doLogout()">Logout</a></li>
</ul>

使用注销方法的topmenu控制器:

// controllers/topmenu.js

$scope.template = {url: 'views/topmenu.html'};

$scope.doLogout = function() {
  localStorageService.clearAll();
  $window.sessionStorage.token = '';
  $location.path('/login');
};

问题是:当我点击应用程序中的“logout”时,topmenu控制器被调用并销毁会话但是路由器中的主要控制器也被调用并显示错误,因为会话被销毁了!

我发现阻止这种情况的唯一(不令人满意的)解决方案是在应用的每个控制器中添加此代码:

if ($window.sessionStorage.token = '') {
    return;
}

有没有办法执行标题控制器而不是主要的ng-view控制器?

1 个答案:

答案 0 :(得分:0)

我终于找到了答案:https://stackoverflow.com/a/11672909/900416

现在我的退出链接如下:<a href ng-click="doLogout()">Logout</a>