Question

我注册为用户时，注册按钮有问题，实际上有T＆c复选框。选中该复选框后，仅应启用按钮。一切进展顺利但是，当我刷新页面时，我看不到按钮，甚至复选框也看不到其他所有元素。这是我用于复选框和“注册”按钮的HTML标签，还使用了标志。

<p class="terms"> <div class="chckbx-cntnr zeromargin" style = "padding:2px;vertical-align:middle"><input type="checkbox" id="rd" name="check" class="flashadmin" ng-model="user.tnc" ng-click="setbuttonFlag(user.tnc)" class="flashadmin"><label class="cstmchk_lbladmin" for="rd"></label></div>
           I agree to the <a href="#!terms_conditions" target="_blank">Terms of Use</a> and <a href="#!privacy_policy" target="_blank">Privacy Policy</a>.</p>

<button ng-if="buttonFlag==true" id="signup"class="btn btn-default btn-block btn-login" type="submit" >Sign up</button> <button ng-if="buttonFlag==false" id="signup" class="btn btn-default btn-block btn-login" disabled >Sign up</button>

这是我为标志写的验证

$scope.buttonFlag=false;
$scope.setbuttonFlag =function(checkbox){
    if(checkbox == true){
        $scope.buttonFlag=true;
    }else{
        $scope.buttonFlag=false;
    }
};

我要进入控制台错误：$ injector：unpr 未知提供商

Answer 1

第一件事是您的代码看起来笨拙！

在犯了错误之后，您完全误解了这个概念。

为什么在HTML中需要两个“提交”按钮？同样，无需单独单击事件即可更改按钮标志。

现在要问您的问题：

刷新页面时我看不到按钮

这是因为您在初始化设置$scope.buttonFlag=false的控制器时正在同时在按钮元素中使用ng-if指令，因此很明显在刷新时看不到按钮。

以下代码段将为您服务！

angular.module("app", []).controller("testCtrl", function($scope) {
 $scope.buttonFlag = false;
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app">
  <div ng-controller="testCtrl">
    <input type="checkbox" ng-model='buttonFlag'> I agree to the Terms of Use and Privacy Policy.
    <button ng-disabled='!buttonFlag' id="signup" class="btn btn-default btn-block btn-login">Sign up</button>
  </div>
</div>

Answer 2

刷新后，您需要手动将buttonFlag设置为false，因此按钮消失。将buttonFlag存储在localStorage中并检查buttonFlag的状态，这与您将其设置为false不同。

if(localStorage.getItem('buttonFlag')){
    buttonFlag = localStorage.getItem('buttonFlag');
}
else{
    buttonFlag = false;
}

还使用ng-disabled禁用或启用按钮，而不是使用两个不同的按钮进行注册

页面刷新后，注册按钮就会消失

2 个答案: