【问题标题】:Get value from multiple checkboxes in AngularJS从 AngularJS 中的多个复选框中获取值
【发布时间】:2015-05-24 16:16:47
【问题描述】:

以下是我的代码,我试图在其中获取多个选中复选框的值,但有些代码无法正常工作。让我知道我在这里做错了什么,顺便说一句,列表是动态的,不会只包含数组中的 3 个项目。

我的 Plnkr - PLNKR CODE

HTML -

    <table>
    <tr ng-repeat="student in studentList">
   <td ng-bind="$index + 1"></td>
   <td ng-bind="student.email"></td>
   <td ng-bind="student.fname"></td>
   <td ng-bind="student.lname"></td>
   <td>
    <input type="checkbox" ng-model="studcheck" ng-value="$index" />
   </td>
</tr>
</table>
{{studcheck}}

控制器代码 -

var myApp = angular.module('myApp', []);

myApp.controller('mainCtrl', function($scope){
  $scope.studentList = [
    {email: 'test1@gmail.com', fname: 'Test1', lname: 'Last1' },
    {email: 'test2@gmail.com', fname: 'Test2', lname: 'Last2' },
    {email: 'test3@gmail.com', fname: 'Test3', lname: 'Last3' },
  ];

  $scope.studcheck = {};
});

【问题讨论】:

    标签: javascript html angularjs angularjs-scope


    【解决方案1】:

    你不能在同一个模型上多次使用ng-model,但是这里只要指定key就可以了:

    <input type="checkbox" ng-model="studcheck[$index]" ng-value="$index" />
    

    如果您想更新student 模型以了解它是否被选中,您可以尝试使用ng-change

    <input type="checkbox" ng-model="studcheck[$index]" ng-value="$index" ng-change="student.checked = !student.checked" />
    

    【讨论】:

    • 您可以将一个参数绑定到所有复选框,但我相信他正在尝试为每个复选框设置不同的值,其中 ng-value 不适用于复选框...
    • ng-value 在这里正常工作。检查生成的HTML,输入值确实等于$index
    • 你能为此提供 plunker 吗?
    • 谢谢很多..它的工作原理!只是作为一个建议,我现在正在获取数据,例如 - { 1=true, 3=true} 我可以改进这个吗..意思是 {Student_email: , checked: } 类似这样的东西
    • @TechSolvr 只需用这个 更改你的收件箱,你就会看到 student.checked 是真还是假...
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-11-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多