此代碼制作 2 組 3 個單選按鈕。一組單獨的單選按鈕和一組使用 ng-repeat 構造的單選按鈕。可以使用按鈕 AC 選擇兩組單選按鈕，也可以單擊它們本身。
但是：當您單擊 ng-repeat 單選按鈕時，它們不再被按鈕 AC 選中。為什么？
angular.module('radioExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.color = {
name: 'blue'
};
$scope.radiomodel = 'blue';
$scope.radiovalues = ['red', 'green', 'blue'];
$scope.clickA = function() {
$scope.color.name = 'red';
$scope.radiomodel = 'red';
}
$scope.clickB = function() {
$scope.color.name = 'green';
$scope.radiomodel = 'green';
}
$scope.clickC = function() {
$scope.color.name = 'blue';
$scope.radiomodel = 'blue';
}
$scope.radioclick = function(index) {
$scope.clickvalue = index;
}
$scope.radiochange = function(index) {
$scope.changevalue = index;
}
}]);<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.min.js"></script>
<body ng-app="radioExample">
<form name="myForm" ng-controller="ExampleController">
<button ng-click="clickA()">A</button>
<button ng-click="clickB()">B</button>
<button ng-click="clickC()">C</button>
<br/> individual <br/>
<label>
<input type="radio" ng-model="color.name" value="red">
Red
</label><br/>
<label>
<input type="radio" ng-model="color.name" value = "green">
Green
</label><br/>
<label>
<input type="radio" ng-model="color.name" value="blue">
Blue
</label><br/> ng-repeat
<div ng-repeat="i in [0, 1, 2]">
<input type="radio" name="myradio" value="{{radiovalues[$index]}}" ng-model="radiomodel" ng-click="radioclick($index)" ng-change="radiochange($index)"> {{$index}} ({{radiovalues[$index]}}) </input>
</div>
<tt>color = {{color.name | json}}</tt><br/>
</form>
</body>uj5u.com熱心網友回復：
問題是您在 ng-repeat 中使用了錯誤的 ng-model。我變了
ng-model="radiomodel"
進入
ng-model="color.name"
這是作業示例：https ://jsfiddle.net/avgustin/x5q8kfdv/
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/520424.html
標籤：javascriptangularjs单选按钮angularjs-ng-重复