Angularjs:选择所有复选框,删除多个用户 [英] Angularjs: select all checkbox to delete multiple users

查看:234
本文介绍了Angularjs:选择所有复选框,删除多个用户的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想实现全选复选框(多个删除)。
我曾尝试在 Plunker 给出的code。它给下面的错误

I want to implement select all checkbox (for multiple delete). I have tried the code given in Plunker. Its giving the following error:

 `Unknown provider: $elementProvider <- $element <- allUsersCtrl`

您可以提供任何解决方案或阐明我哪里有错了一些轻!
这是脚本:

Can you provide any solution or shed some light on where i have gone wrong! This is the script:

var angularControllers = angular.module('angularControllers', ['flash']);  
angularControllers.controller('allUsersCtrl', ['$scope','$http','$element', function($scope,$http,$element){
// $scope.allUsers contains users
//delete multiple
      $scope.arrayToPost = [];
      $scope.checkedAll = false;
      angular.forEach($scope.allUsers, function(user) {
        user["checked"] = false;
        });

        $scope.toggleCheckAll = function() {
       if($scope.checkedAll) {
         angular.forEach($scope.allUsers, function(user) {
           user.checked = true
            $scope.modifyArrayToPost(user);
         });
       }
       else {
         angular.forEach($scope.allUsers, function(user) {
           user.checked = false;
            $scope.modifyArrayToPost(user);
         });
       }

     }

      $scope.modifyArrayToPost = function(user) {
       if(user.checked && $scope.arrayToPost.indexOf(user.user_id) == -1){
         $scope.arrayToPost.push(user.user_id);
       }
       else if(!user.checked) {
         $scope.arrayToPost.splice($scope.arrayToPost.indexOf(user.user_id), 1);
       }
     }

      $scope.$watch('allUsers', function() {
       var allSet = true;
       var allClear = true;
       angular.forEach($scope.allUsers, function(user) {
          if (user.checked) {
            allClear = false;
          } else {
            allSet = false;
          }         
       });

       var checkAll = $element.find('#all');
       checkAll.prop('indeterminate', false);
       if (allSet) {
          $scope.checkedAll = true;
       } else if (allClear) {
          $scope.checkedAll = false;
       } else {
          $scope.checkedAll = false;
          checkAll.prop('indeterminate', true);
       }
     }, true);

        $scope.testFunction=function(params)
        {
        console.log(params);
            $http.post("../admin/users/testFunction",{'params' : params}) 
                .success(function (data, status, headers, config) 
                { 
                console.log(data);
                }) 
                .error(function(data, status, headers, config){

                });
        }

}]); //allUsersCtrl

这是视图:

<form  action="" method="post" name="myform" />
     <input type="checkbox" name="chk_all"  ng-model="checkedAll" id="all"  ng-change="toggleCheckAll()" /> Select All
    <table class="table table-striped table-bordered table-hover">  
        <tr ng-repeat="user in allUsers">
        <td><input type="checkbox" ng-model="user.checked"  class="chk_all" value="{{user.id}}" ng-change="modifyArrayToPost(user)"  /></td>
        </tr>   
    </table>
<input type="submit" value="test" ng-click="testFunction(arrayToPost)"/>
 <tt>array: {{arrayToPost}}</tt>
</form>

我要删除选定的用户上按一下按钮。请帮助。

I want to delete selected users on button click. Please help.

推荐答案

解决。
@Guinn:Guinn,我成功了!我用你的code。结果
但只是做了小的变化:从模块中删除 $元素,来自世界各地。并用 angular.element 直接

Solved. @Guinn: Hi, Guinn, I succeed! I used your code.
But just did small change: removed $element from module, from everywhere. And used angular.element directly.

影响 $元素removel后两行为:

var checkAll=angular.element.find('#all');
$(checkAll).prop('indeterminate', false);`

这个链接可以帮助: https://docs.angularjs.org/api/纳克/功能/ angular.element

这篇关于Angularjs:选择所有复选框,删除多个用户的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆