2013-04-05 141 views
53

我需要製作一個系統,通過選擇的票數來更改總價格。我創建了一些單選按鈕來選擇票數。其中的優點是缺省值未設置,加載時結果爲空。如何設置AngularJS中單選按鈕的默認值?

<input type="radio" ng-model="people" value="1" checked="checked"><label>1</label> 
<input type="radio" ng-model="people" value="2"><label>2</label> 
<input type="radio" ng-model="people" value="3"><label>3</label> 
<ul> 
    <li>{{10*people}}€</li> 
    <li>{{8*people}}€</li> 
    <li>{{30*people}}€</li> 
</ul> 

Please see my jsfiddle.

+0

想要設置什麼默認值 – 2013-04-05 12:21:51

+1

旁註爲任何人使用{{$ index}}獲得價值,您的模型需要將初始值'1'串聯起來。 – user420667 2016-12-12 03:28:32

回答

109

設置peoplengInit

<div ng-app> 
    <div ng-init="people=1" /> 
     <input type="radio" ng-model="people" value="1"><label>1</label> 
     <input type="radio" ng-model="people" value="2"><label>2</label> 
     <input type="radio" ng-model="people" value="3"><label>3</label> 
    <ul> 
     <li>{{10*people}}€</li> 
     <li>{{8*people}}€</li> 
     <li>{{30*people}}€</li> 
    </ul> 
</div> 

演示默認值:Fiddle

+0

謝謝!解決了! – WalterV 2013-04-05 12:30:02

+21

你也可以通過設置scope.people = 1在控制器內部這樣做,這是http://docs.angularjs.org/api/ng.directive:ngInit – goh 2013-12-04 16:45:13

+0

@Arun中描述的建議方法,如果值有字符而不是數字。那麼'ng-init'的代碼是怎麼樣的? – 2014-11-06 09:43:05

19
<div ng-app="" ng-controller="myCntrl">  
     <input type="radio" ng-model="people" value="1"/><label>1</label> 
     <input type="radio" ng-model="people" value="2"/><label>2</label> 
     <input type="radio" ng-model="people" value="3"/><label>3</label> 
</div> 
<script> 
    function myCntrl($scope){ 
     $scope.people=1; 
    } 
</script> 
+0

在scoped上設置這樣的值解決了它爲了我。 – 2015-01-23 17:22:13

+0

這一個爲我工作。 – luizfelippe 2016-09-13 01:51:45

9

爲什麼不ng-checked="true"

+11

因爲它會直觀地檢查單選按鈕,但不會像設置單擊通過瀏覽器的單選按鈕那樣設置「人員」的值。 – Tristan 2016-06-20 13:27:27

+1

答案部分不是提問的好地方。對於接受的答案,評論會更好。 – shanemgrey 2016-09-26 15:25:28

+1

這幫了我一把。感謝您的幫助。 – 2017-12-19 06:44:18

-6
<input type="radio" name="gender" value="male"<%=rs.getString(6).equals("male") ? "checked='checked'": "" %>: "checked='checked'" %> >Male 
       <%=rs.getString(6).equals("male") ? "checked='checked'": "" %> 
相關問題