0

我正在尝试切换已绑定功能的删除按钮。该列表是使用 ng-repeat 检查用户对象创建的。但是到目前为止我看到的方法要么是简单的模型展示,在我的情况下不起作用。或复杂的指令控制器方法。

我只需要检查是否至少选中了一个复选框。以下是代码片段:

                    <table class="table">
                    <tr ng-repeat="user in ctrl.commonUserService.users | filter:ctrl.commonUserService.suppressLoggedOnUserFilter()">

                        <td><input type="checkbox" ng-model="user.selected" value="y" /></td>
                        <td title="User Name"><strong>{{user.userName}}</strong></td>

如何使用 Angular 轻松做到这一点?我试图创建一个循环用户的函数并查看他们是否被选中,但我认为我不能将此函数用于 ng-show。

4

2 回答 2

0

您必须检查状态更改时是否至少选择了一个框:

<td><input type="checkbox" ng-model="user.selected" ng-change="ctrl.userSelected()" value="y" /></td> <!-- use ng-change to notify when a checkbox is clicked -->

<button ng-click="ctrl.delete()" ng-show="ctrl.usersSelected">Delete</button> <!-- if ctrl.usersSelected is true show delete -->

在控制器中:

this.userSelected = function userSelected() { // when checkbox is clicked check users to see if at least one is selected and save the state in this.userSelected
    this.usersSelected = this.commonUserService.users.some(function(user) {
        return user.selected;
    });
};
于 2015-09-01T15:45:18.853 回答
0

ng-change您可以使用输入上的指令相当容易地做到这一点。有关工作示例,请参见此 plunkr,但它基本上是这样的:

看法:

<table class="table">
    <tr ng-repeat="user in users">
    <td><input type="checkbox" ng-change="isSelected()" ng-model="user.selected" /></td>
    <td title="User Name"><strong>{{user.userName}}</strong></td>
    </tr>
</table>
<button class="delete" ng-show="showDelete">Delete</button>

控制器

$scope.isSelected = function() {
    var somethingSelected = false;
    $scope.users.forEach(function(user, index) {
        if (user.selected) somethingSelected = true;
    });
    $scope.showDelete = somethingSelected;
};
于 2015-09-01T16:03:16.957 回答