從html訪問$ window.sessionStorage

Question

在我的情況下，我正在使用angularjs，我想在用戶中訪問一個保存的值，以顯示或不顯示某些HTML標簽。

首先，它在一些控制器中保存用戶變量，它是登錄操作的一部分。

$window.sessionStorage.setItem('user', AuthenticationService.getUser());

然后，我想根據該用戶的角色顯示一些html標簽，具體如下：

<li><a id="id" ng-if="user.role=='admin'" href> console </a></li>

我使用$ rootScope有類似的東西，但是當我刷新頁面時，我失去了價值。 這就是我需要使用window.sessionStorage的原因

有沒有辦法在html中訪問sessionStorage中保存的值？ 或者這是錯的，我需要另一種方法？

Answer 1

您可以通過服務/工廠完成

angular.module('myApp').factory("PrincipalService", [
    "$window",
    function($window){

        var user;

        return {
            getUser : getUser,
            setUser: setUser
        };

        function getUser(){
            return user || angular.fromJson($window.sessionStorage.getItem('user'));
        }

        function setUser(userInfo){
            user = userInfo;
            $window.sessionStorage.setItem('user', angular.toJson(userInfo));
        }

    }
]);

編輯

我可以使用它通過rootScope分享每個視圖的方式：

angular.module("myApp").run(["$rootScope", "PrincipalService",
    function($rootScope, PrincipalService){
        $rootScope.getUser = PrincipalService.getUser;
        $rootScope.setUser = PrincipalService.setUser;
    }
]);

然后，在您的觀點中，您可以致電：

<span>{{$root.getUser()}}</span>

Answer 2

$ window只是窗口的包裝器，所以這種方法可行，但更好的是使用其他方法，如cookie而不是污染$ window。

您應該使用控制器功能，甚至更好的全局用戶服務來訪問用戶。

這里有一篇關於如何做到這一點的非常詳細的文章： http ： //www.nesterovsky-bros.com/weblog/2015/01/26/windowsessionStorageInAngularJS.aspx

如果您有多個用戶屬性，請使用toJson和fromJson將對象存儲在會話存儲中，例如：

var user = { name:'mike', role: 'admin'}
$window.sessionStorage.setItem('user',angular.toJson(user));

和：

var user = angular.fromJson($window.sessionStorage.getItem('user'))

如果您需要從多個不同的地方訪問用戶，建議使用像@Deblaton這樣的服務，但假設您的用戶有多個屬性，請像上面一樣添加angular.toJson和angular.fromJson行。 。

您在html中訪問用戶的方式要求它出現在當前范圍內，因此如果您在控制器中使用服務方法，則需要添加：

$scope.user = UserService.getUser();