JWTで認証を管理しています。ng-hide と ng-show を使用して、ナビのログイン ボタンとログアウト ボタンを表示/非表示にしようとしています。動いていない。トークンは保存されていますが、表示/非表示を機能させることができません。
サービス:
angular.module('psJwtApp')
.factory('authToken', function ($window) {
var storage = $window.localStorage;
var cachedToken;
var userToken = 'userToken';
var isAuthenticated = false;
var authToken = {
setToken: function (token) {
cachedToken = token;
storage.setItem(userToken, token);
isAuthenticated = true;
},
getToken: function () {
if(!cachedToken)
cachedToken = storage.getItem(userToken);
return cachedToken;
},
isAuthenticated: function () {
return !!authToken.getToken();
},
removeToken: function () {
cachedToken = null;
storage.removeItem(userToken);
isAuthenticated = false;
}
};
return authToken;
});
コントローラ:
angular.module('psJwtApp')
.controller('HeaderCtrl', function ($scope, authToken) {
$scope.isAuthenticated = authToken.isAuthenticated();
});
html:
<div ng-controller="HeaderCtrl" class="header">
<ul class="nav nav-pills pull-right">
<li ui-sref-active="active">
<a ui-sref="main">Home</a>
</li>
<li ui-sref-active="active">
<a ui-sref="jobs">Jobs</a>
</li>
<li ng-hide="isAuthenticated()" ui-sref-active="active">
<a ui-sref="login">Log In</a>
</li>
<li ng-show="isAuthenticated()" ui-sref-active="active">
<a ui-sref="logout">Logout</a>
</li>
</ul>
<h3 class="text-muted">psJwt</h3>
</div>