将本地存储认证令牌状态与视图同步

Sync local storage auth token status with the views

本文关键字：状态 视图 同步 令牌 认证 存储      更新时间：2023-09-26

我在angular js中有两个控制器。

  • NavCtrl控制导航栏并根据需要显示退出按钮
  • AuthCtrl负责认证和设置本地存储

我所面临的问题是设置令牌和在两个控制器中检索相同的一切都很好。

但是当我验证时，我需要重新加载页面以查看NavCtrl中的变化，因为它在页面呈现时获取值。是否有一些方法，我可以通过通知NavCtrl时，有一个login或logout请求渲染相应的变化?

.controller 'AuthCtrl',($scope,User)->
    $scope.login = ()->
        User.auth $scope.username,$scope.password
        return
    return
.controller 'NavCtrl',($scope,User,$window)->
    $scope.is_authenticated = $window.localStorage.getItem "authFlag"
    console.log $window.localStorage.getItem "token"
    console.log $window.localStorage.getItem "authFlag"
    $scope.logout = ()->
        User.logout()
        $scope.is_authenticated = $window.localStorage.getItem "authFlag"
    return

User是我定义的factory, authFlag是存储验证状态的bool。基本上我想听在authFlag

所做的更改

如果可能的话，如果这是最佳做法，请评论，或者我做错了什么。

这个问题可以通过添加一个简单的广播来解决。在进行身份验证的用户工厂中，添加

$rootScope.$broadcast 'authEvt'

和navCtrl中使用

捕获广播

$rootScope.$on "authEvt",()-> $scope.is_authenticated = $window.localStorage.getItem "authFlag" return

这将在localStorage事件更改时重新加载变量

相关文章：