1

我的 ng-table 正在像这样构建

                    <table ng-table="storeCommandsTableParams" class="table tile">
                    <tr ng-repeat="storeCommand in $data">
                        <td>
                                <input type="checkbox" ng-change="vm.toggleCommandSelection(storeCommand)"  ng-model="vm.selectedCommands" >
                        </td>
                    </tr>
                </table>

我有这样的控制器设置。

    var vm = this;          
    vm.selectedCommands = { };
    vm.toggleCommandSelection = function (storeCommand) {
        var idx = vm.selectedCommands.indexOf(storeCommand);
        // is currently selected
        if (idx > -1) {
            vm.selectedCommands.splice(idx, 1);
        }
            // is newly selected
        else {
            vm.selectedCommands.push(storeCommand);
        }
    };

我想要完成的是，当用户单击复选框时，应将相应的 storeCommand 发送到函数 vm.toggleCommandSelection 以便我可以选择 storeCommands 列表。但是这个函数没有被触发。

普朗克

4

2 回答 2

0

你的模型不是storeCommandbut vm.selectedCommands。因此ng-change，当您单击复选框时，在这种情况下不会触发。也许你可以ng-click改用。

尝试这个

<input type="checkbox" ng-click="vm.toggleCommandSelection($event, storeCommand)">

    var vm = this;          
    vm.selectedCommands = [];
    vm.toggleCommandSelection = function ($event, storeCommand) {
        var idx = vm.selectedCommands.indexOf(storeCommand);
        if ($event.target.checked) {
            if (idx === -1) {
               vm.selectedCommands.push(storeCommand);
            } 
        }
        else {
            if (idx > -1) {
              vm.selectedCommands.splice(idx, 1);
            } 
        }
    };

演示 http://plnkr.co/edit/kcW7YCWsXE8mtZoxjm1J?p=preview

于 2015-06-01T17:54:53.817 回答
0

问题尚未解决，但我建议您使用 $scope。在这里，我假设您在控制器中的所有数据都是 $scope.data

在 HTML 结尾处：

      <!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.15/angular.js" data-semver="1.3.15"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
       <table ng-table="storeCommandsTableParams" class="table tile">
                    <tr ng-repeat="category in categories">
                        <td>
                            <label class="checkbox" for="{{category.id}}">
                               <input type="checkbox" ng-model="selection.ids[category.id]" name="group" id="{{category.id}}" / >
                                {{category.name}}  
                        </td>
                    </tr>
           <pre ng-bind="selection.ids | json"></pre> 
       </table>
  </body>

</html>

在相应控制器的脚本中，编写：

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

app.controller('MainCtrl', function($scope) {

    $scope.categories = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ];
      $scope.selection = {

    };

});

嗨，据我了解，我已经用虚拟数据更新了我的答案。也请在此处找到 plunker 的工作链接PLUNKER

于 2015-06-01T18:26:44.833 回答