即使在页面刷新或从应用程序注销后也禁用该按钮答案

【问题标题】：Disable the button even after page refresh or logout from the application即使在页面刷新或从应用程序注销后也禁用该按钮
【发布时间】：2018-11-15 20:28:18
【问题描述】：

我有以下代码，当我刷新应用程序时，按钮处于启用状态。即使在页面刷新或从应用程序注销后，我也希望按钮处于禁用状态。基本上我需要save the state of the button。我该怎么做？

//html
<div>
<input type="file" ng-disabled="false" id="id1">
</div>

//Controller
document.getElementById("id1").disabled = true;

【问题讨论】：

标签： css angularjs angular-cookies

【解决方案1】：

您可以使用localStorage 保存状态，这是简单的解决方案。

存储页面刷新和注销的值

localStorage.setItem('isPageRefreshed', 'true'); // page refresh

localStorage.setItem('isLoggedOut', 'true'); // on logout

现在您可以添加按钮禁用检查，如下所示：

HTML：

<input type="file" ng-disabled="isDisabled" id="id1">

JavaScript/控制器：

if(localStorage.getItem('isPageRefreshed') === "true") {
  $scope.isDisabled = true;
}

if(localStorage.getItem('isLoggedOut') === "true") {
  $scope.isDisabled = true;
}

任何时候你想启用按钮然后这样做$scope.isDisabled = false;

【讨论】：

嗨 VicJordan 我试过你的代码 sn-p 并抛出错误“无法设置属性禁用 null”。

【解决方案2】：

使用ng-disabled的正确方法是通过控制器来控制。

<div>
<input type="file" ng-disabled="isUserLoggedIn" id="id1">
</div>

控制器

$scope.isUserLoggedIn = this.appService.isUserLoggedIn() || false;
//returns true or false based on if user is logged In

应用服务

这可以检查 VicJordan 提到的本地存储或您想要和实现的任何逻辑。

【讨论】：