Angularjs：設置一個單選按鈕，根據存儲的數據進行檢查

我試圖檢查帳戶類型的單選按鈕。它正確地在數據庫中，但是當我加載這個頁面時它不顯示。但是，當我單擊一個單選按鈕時，它會正確更新該值並將其自身顯示爲已檢查。Angularjs：設置一個單選按鈕，根據存儲的數據進行檢查

account.accountType是一個枚舉，它有3個選項internal = 0，customer = 1或proposal = 2。它也可以是null，然後它將被設置，然後不會被檢查。我該怎麼做？

我在角1.4.9和使用typecript的控制器。

<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>

來源

2017-10-17 Jake Steele

發佈您的控制器代碼，以更好地理解。 –

// 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>

來源

2017-10-17 17:16:48

account.accountType實際上是一個枚舉。所以這個解決方案對我來說不起作用。我編輯了這個問題。抱歉。 –

NG-檢查指令不應與ngModel一起使用，因爲這可能會導致意外的行爲。使用此爲每個無線電

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

來源

2017-10-17 17:41:45

account.accountType實際上是一個枚舉。所以這個解決方案對我來說不起作用。我編輯了這個問題。抱歉。 –

Angularjs：設置一個單選按鈕，根據存儲的數據進行檢查

回答

相關問題