angularjs ng-repeat 单选按钮

Question

此代码制作 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>

Answer 1

问题是你在 ng-repeat 中使用了错误的 ng-model。 我变了

ng-model="radiomodel"

进入

ng-model="color.name"

这是工作示例： https://jsfiddle.net/avgustin/x5q8kfdv/

angularjs ng-repeat 单选按钮

问题描述

1 个解决方案

解决方案1
0 已采纳 2022-10-05 13:53:16

angularjs ng-repeat 单选按钮

问题描述

1 个解决方案

解决方案1 0 已采纳 2022-10-05 13:53:16

解决方案1
0 已采纳 2022-10-05 13:53:16