從角度單選按鈕獲取價值

我正在嘗試按照單選按鈕的角度文檔。 https://docs.angularjs.org/api/ng/input/input%5Bradio%5D 不知道我在做什麼錯。從角度單選按鈕獲取價值

最終，如果選擇無線電選項3，我希望div「stuff」具有「靜音」類。

我的html：

<form name="shippingVm.MasterCartonForm" ng-controller="shippingControler as shippingVm" > 

    [{{shippingVm.shipOption.val}}] 

    <div class="col-sm-3 col-sm-offset-1"> 
     <label class="radio-inline"> 
      <input type="radio" ng-model="shippingVm.shipOption.val" name="shippingOptions" ng-value="one" /> 
      I will call Purolator for a pickup. 
     </label> 
    </div> 
    <div class="col-sm-3"> 
     <label class="radio-inline"> 
      <input type="radio" ng-model="shippingVm.shipOption.val" name="shipOptions" ng-value="two" /> 
      I will deliver them to Purolator. 
     </label> 
    </div> 
    <div class="col-sm-4"> 
     <label class="radio-inline"> 
      <input type="radio" ng-model="shippingVm.shipOption.val" name="shipOptions" ng-value="muted" /> 
      I will deliver them to the Wizmo warehouse myself. 
     </label> 
    </div> 

    <div class="ng-class="shippingVm.shipOption.val"> 
     stuff 
    </div> 

</form>

我的控制器：

vm.shipOption = {val: "NOT-muted"};

在HTML檢查該調試線，看看我得到了正確的價值：

[{{shippingVm.shipOption.val}}]

它始於[非靜音] - 應該如此。但是當我選擇任何單選按鈕時，它就會變成空白。

根據文檔，點擊收音機應將收音機的值放入模型中。

我錯過了什麼？

來源

2016-07-07 DaveC426913

你的NG-類。不正確，請參閱下段爲它應該是什麼樣的例子第二個問題是，你希望值，而不是NG-值來自：https://docs.angularjs.org/api/ng/input/input%5Bradio%5D

值將ngMode值l表達式應該在選擇時設置。請注意，該值僅支持字符串值，即範圍模型也必須是字符串。如果您需要複雜的模型（數字，對象，...），請使用ngValue。

ngValue選擇收音機時將設置ngModel的角度表達式。如果你需要一個非字符串ngModel（boolean，array，...），應該使用它來代替value屬性。

.muted { 
 
    color: grey; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app> 
 
    <label>Chicken or the Egg?</label> 
 
    <div class="form-group"> 
 
    <div class="radio"> 
 
     <label> 
 
     <input type="radio" name="chickenEgg" value="chicken" ng-model="formData.chickenEgg">Chicken 
 
     </label> 
 
    </div> 
 
    <div class="radio"> 
 
     <label> 
 
     <input type="radio" name="chickenEgg" value="egg" ng-model="formData.chickenEgg">Egg 
 
     </label> 
 
    </div> 
 
    </div> 
 
    <div ng-class="{'muted': formData.chickenEgg === 'egg'}"> 
 
    stuff 
 
    </div> 
 
</div>

來源

2016-07-07 01:47:47 ScottL

哦，我現在看到它。

單選按鈕應該有值 = 「靜音」不NG-值 =靜音」。

NG-值是在特殊情況下，僅使用。

來源

2016-07-07 01:34:02 DaveC426913

從角度單選按鈕獲取價值

回答

相關問題