Angular JS：输入 [radio] 不起作用

Posted 2023-03-27

【中文标题】Angular JS：输入 [radio] 不起作用

【英文标题】：Angular JS: input[radio] doesn't work

【发布时间】：2016-07-14 15:43:06

【问题描述】：

这是我的代码：

<div ng-controller="TestController">
    <input ng-repeat="item in array" ng-model="selected.name" value="item.name" type="radio"></input>
</div>
<script type="text/javascript">
    var app = angular.module('app', []);
    app.controller('TestController', function ($scope) 
        $scope.array = [
            name: 'lee',
            seq: 1,
        , 
            name: 'tom',
            seq: 2,
        , 
            name: 'jack',
            seq: 3,
        ];

        $scope.selected = $scope.array[0];
    );
</script>

显示页面时，默认选中的单选框是正确的。但它不能取消选中，我只能在其他两个复选框之间切换？我该如何解决这个问题？

【参考方案1】：

ng-repeat 创建新范围，因此您应该确定父范围。

更多信息见https://docs.angularjs.org/api/ng/directive/ngRepeat

var app = angular.module('app', []);
    app.controller('TestController', function ($scope) 
        $scope.array = [
            name: 'lee',
            seq: 1,
        , 
            name: 'tom',
            seq: 2,
        , 
            name: 'jack',
            seq: 3,
        ];

        $scope.selected = $scope.array[0].name;
    );

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="TestController">
  <div ng-repeat="item in array">
     <input type="radio" ng-model="$parent.selected"  
    ng-value="item.name" > 
  </div>
</div>

【讨论】：

如果数组类似于 ['blah', 'blah', 'blah']，那么 ng 值是否会是“item.item”？