Angular.js：将单选按钮设置为根据存储的数据进行检查

Question

我正在尝试检查帐户类型的单选按钮。 它正确地存在于数据库中，但是在我加载此页面时没有显示。 但是，当我单击单选按钮时，它会正确更新该值并显示为选中状态。

account.accountType是一个枚举，具有3个选项，内部= 0，客户= 1或投标=2。在设置之前也可以为null，然后不进行任何检查。 我该怎么做呢？

我正在使用angular 1.4.9，并使用打字稿作为控制器。

 <div class="form-group" ng-class="{ 'has-error': accountForm.$submitted && accountForm.accountType.$invalid }"> <label for="customerName">Account type:</label> <div> <label class="radio-inline"> <input type="radio" name="accountType" id="internal" value="0" ng-model="account.accountType" ng-required="true" ng-checked="account.accountType == 0"> Internal </label> <label class="radio-inline"> <input type="radio" name="accountType" id="customer" value="1" ng-model="account.accountType" ng-required="true" ng-checked="account.accountType == 1"> Customer </label> <label class="radio-inline"> <input type="radio" name="accountType" id="proposal" value="2" ng-model="account.accountType" ng-required="true" ng-checked="account.accountType == 2"> Proposal </label> </div> <p class="text-danger" ng-if="accountForm.$submitted && accountForm.accountType.$invalid">Please choose an account type</p> </div> 

Answer 1

// change value of account.accountType in your controller then the corresponding //checkBox will be checked. //for example, i have set account.accountType as 2 with ng-init then //secondcheckbox will be checked on load change value of account.accountType in your controller then the corresponding //checkBox will be checked. //for example, i have set account.accountType as 2 with ng-init then //secondcheckbox will be checked on load

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="" ng-init="account.accountType = 2" class="form-group" ng-class="{ 'has-error': accountForm.$submitted && accountForm.accountType.$invalid }"> <label for="customerName">Account type:</label>{{account.accountType}} <div> <label class="radio-inline"> <input type="radio" name="accountType" id="internal" value="1" ng-model="account.accountType" ng-required="true" ng-checked="account.accountType == 1"> Internal </label> <label class="radio-inline"> <input type="radio" name="accountType" id="customer" value="2" ng-model="account.accountType" ng-required="true" ng-checked="account.accountType == 2"> Customer </label> <label class="radio-inline"> <input type="radio" name="accountType" id="proposal" value="3" ng-model="account.accountType" ng-required="true" ng-checked="account.accountType == 3"> Proposal </label> </div> <p class="text-danger" ng-if="accountForm.$submitted && accountForm.accountType.$invalid">Please choose an account type</p> </div> 

Answer 2

ng-checked指令不应与ngModel一起使用，因为这可能导致意外行为。 每个收音机都用这个

  <input type="radio" name="accountType"
                   id="internal" value="0"
                   ng-required="true" ng-checked="account.accountType == 0">