ng-if块内的功能不起作用

Question

您好我尝试使用angular和localstorage进行身份验证。我遇到了这个问题。

下面的

是我app.js中代码的一部分

app.run(function($window,$rootScope){

    $rootScope.isAuthed=function(){
        console.log("starting isAuthed...."+$window.localStorage.getItem("isAuthenticated"))
        return $window.localStorage.getItem("isAuthenticated")
    }
    $rootScope.whoIsCurrenUser=function(){
        return $window.localStorage.getItem("currentUser")
    }

    $rootScope.logout=function(){
        if(confirm("Are you sure to log out ?")){
            $window.localStorage.setItem("isAuthenticated", false);
            $window.localStorage.setItem("currentUser", "");
        }
    }
})

在我的html中，我尝试在ng-if中应用isAuthed函数，但它不起作用

 <ul class="nav navbar-nav navbar-right">
                    <li ng-if="!isAuthed()"><a ng-click="loginDialog()">Log In</a></li>
                    <li ng-if="isAuthed()"><a ng-click="logout()">Log Out</a></li>
  </ul>

我可以在控制台上看到isAuthenticated设置为true

但我的页面上没有登录或退出..

我的问题在这篇文章的标题中：为什么ng-if块中的函数不起作用？

Answer 1

LocalStorage保存strings。

  

返回包含密钥值的DOMString。如果密钥不存在，则返回null。

"true"和"false"都是真实的。您需要在返回之前解析数据。或使用空字符串表示false值。 Demo

app.run(function($window,$rootScope){

    $rootScope.isAuthed=function(){
        console.log("starting isAuthed...."
                + (typeof $window.localStorage.getItem("isAuthenticated"))
                + $window.localStorage.getItem("isAuthenticated"))
        return JSON.parse($window.localStorage.getItem("isAuthenticated"))
    }

Answer 2

一个简单的解决方案是将isAuthed函数的结果与字符串进行比较为＆＃34; true＆＃34;。代码可以是：

$rootScope.isAuthed=function(){
    console.log("starting isAuthed...."+$window.localStorage.getItem("isAuthenticated"))
    return $window.localStorage.getItem("isAuthenticated") === "true";
}