如何在Angularjs中获取嵌套ng-repeat中的复选框值

时间:2017-11-15 08:55:07

标签: javascript angularjs html5 asp.net-web-api2

我有一个嵌套的ng-repeat,第一个作为部门的标题,第二个显示属于该部门的员工。如果我有多个已检查的部门密钥和多个员工密钥,我希望知道如何捕获或获取它们的值,然后将它们发送到Web API。提前谢谢。

HTML就像

<fieldset id="field3">
   <table>
       <tr ng-repeat="e in empdepts | groupBy:'dep_LDesc'">
           <td>
               <label ng-click="showContent = !showContent"></label>
               <details ng-open="showContent">
               <summary><input type="checkbox" ng-model="e[0].master" ng-click="group(e[0].master,e)" /> {{e[0].dep_LDesc}}</summary>
               <div ng-repeat="employee in e">
               <input type="checkbox" ng-model="employee.details" > {{employee.Sname}} 
               </div>
               </details>
           </td>
       </tr>
   </table>

   <hr />
   <table>
       <tr>
            <td><input type="checkbox" ng-model="all" ng-click="selectall(all)"  /> All Departments</td> 
       </tr>
       <tr>
            <td><input type="checkbox" ng-model="self"/> Self Services </td> 
       </tr>
    </table>
</fieldset>

控制器就像

Assign.controller("AssignController", function ($scope, Assignments) {

LoadEmpDepts();
function LoadEmpDepts() {
    Assignments.getempdepts().then(function (response) {
        $scope.empdepts = (response.data);
        console.log($scope.empdepts);
    })
}

$scope.group = function (m, x) {
    angular.forEach(x,function (cv) {
        cv.details = m;
    })
   return m;
}

$scope.selectall = function (value) {
    $scope.master = value;
    angular.forEach($scope.empdepts, function (cv) {
        cv.details = value;
        cv.master = value;
    })
}

提前致谢enter image description here

1 个答案:

答案 0 :(得分:0)

使用角度复制,仅发送已修改的复选框值。并且您需要按下数组中的所有复选框值。

See Example in Official Documentation of AngularJS

推送代码示例:

在控制器中

档案名称:1.js

var app = angular.module("myApp",[]);
app.controller("myController",function($scope){
$scope.newArray =[];
$scope.arrayPush =function()
{
    console.log("new1");
    $scope.newArray.push({name:$scope.name});
    console.log($scope.newArray);
}
})

在视图中

文件名: 1.html

<div ng-app="myApp" ng-controller="myController">
<p>Input something in the input box:</p> 
<input type="text" ng-model="name" placeholder="Enter name here">
<button ng-click="arrayPush()">Test Button</button>
</div>
</body>
 <script type="text/javascript" src="1.js"></script>

试试此代码..如果您收到任何错误,请在评论中提及..

...谢谢

回答已更新