触发所有的复选框事件，而在angularjs选择checkall [英] triggering all the checkbox event while selecting checkall in angularjs

问题描述

 ＆LT;表类=表＆GT;
＆LT;＆THEAD GT;
            ＆LT;第i个＆LT;输入类型=复选框名称='全选'NG模型=值1NG点击=全选（）＆GT;＆LT; /第i
            ＆LT;第i个名称和LT; /第i
        ＆LT; / THEAD＆GT;
        ＆LT; TR NG重复=X中的项目＆GT;
            ＆LT; TD＆GT;＆LT;输入类型=复选框NG模型=值2NG-真值=YESNG-假值=NONG点击=选择（$事件，x.id ）
                            /＆GT;＆LT; / TD＆GT;
            ＆所述; TD＆GT; {{x.name}}＆下; / TD＆GT;
            ＆LT; / TR＆GT;
        ＆LT; / TR＆GT;
    ＆LT; /表＆gt;
 

如何，我得到当我点击所有item.id全选（）复选框？

另外，您能否提供我要NG重复复选框合适NG-模型语法？

谢谢，
拉贾氏/ P>

解决方案

\r

\r

VAR的myapp = angular.module（'应用'，[]）;\r
myapp.controller（Ctrl键，功能（$范围）{\r
  VAR VM =这一点;\r
    vm.data = {\r
      项目：\r
         {ID：1，名称：阿里，选择否}，\r
         {ID：2，名称：礼，选择否}，\r
         {ID：3，名称：阿米尔，选择否}\r
      ]\r
     };\r
  \r
  vm.value1 = FALSE;\r
  \r
  vm.selectAll =功能（$事件）{\r
     VAR复选框= $ event.target;\r
     变种选定=否;\r
         如果（checkbox.checked）\r
           {\r
           选=YES;\r
           }\r
    其他{\r
      选=否;\r
      }\r
    angular.forEach（vm.data.items，函数（项目）{\r
             item.selected =选择;\r
             }）;\r
    \r
         \r
         \r
   \r
    }\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控制器=Ctrl键VM＆GT;\r
＆LT;表类=表＆GT;\r
＆LT;＆THEAD GT;\r
            ＆LT;第i个＆LT;输入类型=复选框名称='全选'NG模型=值1NG点击=vm.selectAll（$事件）＆GT;＆LT; /第i\r
            ＆LT;第i个所有＆LT; /第i\r
        ＆LT; / THEAD＆GT;\r
        ＆LT; TR NG重复=X在vm.data.items＆GT;\r
            ＆LT; TD＆GT;＆LT;输入类型=复选框NG模型=vm.data.items [$指数] .selectedNG-真值=YESNG-假值=NONG-点击=vm.select（$事件，x.id）\r
                            /＆GT;＆LT; / TD＆GT;\r
            ＆所述; TD＆GT; {{x.name}}＆下; / TD＆GT;\r
            \r
        ＆LT; / TR＆GT;\r
    ＆LT; /表＆gt;\r
\r
＆LT; / DIV＆GT;

\r

\r

\r

<table class="table">
<thead>
            <th> <input type='checkbox' name='selectall' ng-model="value1" ng-click="selectAll()"></th>
            <th>  Name </th>
        </thead>
        <tr ng-repeat="x in items">
            <td><input type='checkbox' ng-model="value2" ng-true-value="YES" ng-false-value="NO" ng-click="select($event,x.id)"
                            /></td>
            <td>{{x.name}}</td>
            </tr>
        </tr>
    </table>

How to I get all the item.id when I click "selectall()" checkbox ?

Also, Can you suggest me appropriate ng-model syntax for ng-repeat checkbox ?

Thanks, Raja K

解决方案

var myapp = angular.module('app', []);
myapp.controller('Ctrl', function ($scope) {
  var vm = this;
    vm.data = {
      items: [
         {id:1,name:"ali",selected: "NO"},
         {id:2,name:"reza",selected: "NO"},
         {id:3,name:"amir",selected: "NO"}
      ]
     };
  
  vm.value1 = false;
  
  vm.selectAll = function($event){
     var checkbox = $event.target;
     var selected = "NO";
         if(checkbox.checked)
           {
           selected = "YES";
           }
    else {
      selected = "NO";
      }
    angular.forEach(vm.data.items, function(item) {
             item.selected = selected;
             });
    
         
         
   
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="Ctrl as vm">
<table class="table">
<thead>
            <th> <input type='checkbox' name='selectall' ng-model="value1" ng-click="vm.selectAll($event)"></th>
            <th>  All </th>
        </thead>
        <tr ng-repeat="x in vm.data.items">
            <td><input type='checkbox' ng-model="vm.data.items[$index].selected" ng-true-value="YES" ng-false-value="NO" ng-click="vm.select($event,x.id)"
                            /></td>
            <td>{{x.name}}</td>
            
        </tr>
    </table>

</div>

这篇关于触发所有的复选框事件，而在angularjs选择checkall的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！