Question

我有一个复杂的ng-repeat表，我需要为每行的复选框设置select all函数。他是我的代码： JS：

  $scope.getCCGenie = function(){
                CCGenieService.transactionList().then(function(list){
                    $scope.CreditCardsList = list;
                    $scope.CorporateCardsNum = $scope.CreditCardsList.transactionInfo.corpCardCount;
                    $scope.PersonalCardsNum = $scope.CreditCardsList.transactionInfo.personalCardCount;
                });
            } 

            $scope.hasExpenseTypeLabel = false;
            $scope.getCCGenie();
             $scope.checkAllcorp = function(copcards) {
        console.log(copcards);
        if (copcards.selectedAllcorp) {
            copcards.selectedAllcorp = true;
            $scope.hasSelectedExpense = true;

        } else {
            copcards.selectedAllcorp = false;
            $scope.hasSelectedExpense = false;

        }
        angular.forEach('copcards.transactions',function(v,k){
            v.corpisSelected = copcards.selectedAllcorp;
        })
    };
          // I need to loop the selected table to reset each corpisSelected,assign them the new value selectedAllcorp. but how?
            };
Html:

    <ul>
                <li ng-repeat='copcards in CreditCardsList.transactionInfo.corporateCards'>
                <span class='creditcardsubtitle'>{{copcards.cardName}} (****{{copcards.cardNumber}})</span> 
                <table class='table col-xs-12 col-md-12  col-lg-12' border="0" cellpadding="10" cellspacing="0" width="100%">
                    <thead>
                        <th class='text-center'><input type="checkbox" ng-model="copcards.selectedAllcorp" ng-change="checkAllcorp(copcards)"/></th>
                        <th class='text-left'>Date</th>
                        <th class='text-left'>Merchant</th>
                        <th class='text-right'>Amount</th>
                        <th class='text-center'>Expense Type</th>
                        <th class='text-left'><input type="checkbox" ng-model="selectedAllBill" ng-change="checkAllBillable()" style='margin-right:3px;'/>  Billable</th>
                        <th class='text-center'>Attachment</th>
                        <th class='text-center'>Description</th>
                    </thead>
                    <tbody><tr ng-show='noExpense'><td colspan="8"  align="center" style="text-align: center;" >No any Personal Cards!</td>
                    </tr>
                        <tr ng-repeat='componentObject in copcards.transactions' ng-class="{'selectedrow':componentObject.corpisSelected}">
                            <td type='checkbox' class='text-center'><input type='checkbox' ng-model='componentObject.corpisSelected' class='deletebox'/>{{componentObject.corpisSelected}}</td>
                            <td class='text-left tdwidth'>{{componentObject.transactionDateString | parseDateFormat | date}}</td>
                            <td class='text-left tdwidth'>{{componentObject.merchant}}</td>
                            <td class='text-right tdwidth'>${{componentObject.amount}}</td>
                            <td class='text-center tdwidth'><smart-expense-type></smart-expense-type></td>
                            <td class='text-left tdwidth'><input type='checkbox' ng-model='componentObject.isBillable'/></td>
                            <td class='text-center tdwidth'>{{componentObject.hasImage}}</td>
                            <td class='text-center tdwidth'><input type='text'ng-model='componentObject.description'/></td>
                        </tr>
                    </tbody>
                </table>
            </li>
            </ul>

正如你所看到的，我使用nasted ng-repeat循环数据，那里可能有很多表，我希望每个表都有自己的selectAll函数，它独立工作。现在代码部分工作正常，问题是如果你检查行中的单个复选框，checkall函数将无法工作。我知道我需要做这样的事情：

$scope.checkAllcorp = function() {
                if (this.selectedAllcorp) {
                    $scope.hasSelectedExpense = true
                    this.selectedRow = true;
                    this.corpisSelected = true;
                } else {
                    $scope.hasSelectedExpense = false;
                    this.selectedRow = false;
                    this.corpisSelected = false;
                }
          angular.forEach('selectedTable',function(v,k){
                   v.corpisSelected = this.selectedAllcorp;
})
            };

但是如何访问这个'selectedTable'？

Answer 1

将@if (Model != null) { <div> @Model.Exception.Message <br /> @Model.ControllerName </div> }传递给您的函数，然后对该对象进行操作，而不是copcards：

this

然后在你的控制器中：

ng-change="checkAllcorp(copcards)"

Answer 2

你可以通过函数本身调用它来传递你所在的对象

ng-change="checkAllcorp(copcards)

然后将其用作checkAllcorp函数的参数，而不是在函数

中使用它

示例：

<div ng-repeat="name in names"><button ng-click="msg(name)"></button></div>

控制器范围：

$scope.msg = function(name) { alert(name.first)};

如何在angularjs ng-repeat表中设置checkAll

2 个答案: