Angular JS:输入 [radio] 不起作用 [英] Angular JS: input[radio] doesn't work

问题描述

这是我的代码:

<input ng-repeat="数组中的项目" ng-model="selected.name" value="{{item.name}}" type="radio"></input>
<script type="text/javascript">var app = angular.module('app', []);app.controller('TestController', function ($scope) {$scope.array = [{name: '李',序列:1，}, {名称:'汤姆'，序列:2，}, {name: '杰克',序列:3，}];$scope.selected = $scope.array[0];});

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

解决方案

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

有关更多信息，请参阅 https://docs.angularjs.org/api/ng/指令/ngRepeat

var app = angular.module('app', []);app.controller('TestController', function ($scope) {$scope.array = [{name: '李',序列:1，}, {名称:'汤姆'，序列:2，}, {name: '杰克',序列: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="数组中的项目"><input type="radio" ng-model="$parent.selected"ng-value="item.name" >

Here is my code:

<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>

When the page is show, the default checked radio box is correct. But it can not be un-check,and I can only switch between the other two checkbox? How can I fix this problem?

解决方案

ng-repeat create new scope so you should determine parent scope.

for more info see 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>

这篇关于Angular JS:输入 [radio] 不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！