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

问题描述

下面是我的code：

 ＆LT; D​​IV NG控制器=的TestController＆GT;
    ＆LT;输入NG重复= NG-模式阵列项=selected.nameVALUE ={{item.name}}类型=无线电＆GT;＆LT; /输入＆GT;
＆LT; / DIV＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
    VAR应用= angular.module（'应用'，[]）;
    app.controller（'的TestController'，函数（$范围）{
        $ scope.array = [{
            名称：'李'，
            SEQ：1，
        }，{
            名称：'汤姆'，
            SEQ：2，
        }，{
            名称：'杰克'，
            SEQ：3，
        }];        $ scope.selected = $ scope.array [0];
    }）;
＆LT; / SCRIPT＆GT;
 

在该页面显示，默认选中的单选框是正确的。但它不能成为取消检查，我只能另外两个复选框之间切换？我怎样才能解决这个问题？

解决方案

NG-重复创建新的范围，所以你应该确定父范围。

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

\r

\r

VAR应用= angular.module（'应用'，[]）;\r
    app.controller（'的TestController'，函数（$范围）{\r
        $ scope.array = [{\r
            名称：'李'，\r
            SEQ：1，\r
        }，{\r
            名称：'汤姆'，\r
            SEQ：2，\r
        }，{\r
            名称：'杰克'，\r
            SEQ：3，\r
        }];\r
\r
        $ scope.selected = $ scope.array [0]。名称;\r
    }）;

\r

＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r
＆LT; D​​IV NG-应用=应用程序NG控制器=的TestController＆GT;\r
  ＆LT; D​​IV NG重复=项阵列＆GT;\r
     ＆LT;输入类型=电台NG-模式=$ parent.selected\r
    NG-值=item.name＆GT;\r
  ＆LT; / DIV＆GT;\r
＆LT; / DIV＆GT;

\r

\r

\r

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>

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