0

我有一个 tr :

<tr  ng-hide="func(item.status)"  ng-repeat="item in itemArray" >
<td></td>
.
.
</tr>

在 Func() 中,item.status 与下拉列表 D 的值进行比较,用户可以随时更改该下拉列表的值。

我有一个 div,如果当前可见 tr 的数量 == 0,我需要显示它。我将可见 tr 的数量存储为

$scope.qVisible =  $("#tableid tbody tr:visible").length;

只有在执行了所有 ng-hide 语句以获得正确结果后,我如何才能更新 qVisible?

4

2 回答 2

2

我将假设您在某个地方有一个下拉菜单,看起来像..

<select ng-model="selectedStatus" ng-options="status for status in statuses"></select>

所以你的 ng-hide 可以做类似的事情

<tr  ng-hide="item.status !== selectedStatus"  ng-repeat="item in itemArray" >
<td></td>
.
.
</tr>

在您的控制器中,您需要在 selectedStatus 上设置一个手表。

$scope.qVisible = false;

$scope.$watch("selectedStatus",function(newVal){
    //for loop over items.. counting the number of items that match selectedStatus
    // if count is 0, set a scope variable 
    $scope.qVisible = true;
});

在你的 html..

<div ng-show="qVisible">...</div>

这是不接触 DOM 的方法。

于 2013-04-25T09:02:17.150 回答
1

您可以让 $watch 监听与 data-ng-repeat 相同的功能,并运行与 hide 相同的功能:

function update(newValue) {
    var i;
    $scope.numberOfShownItems = 0;

    for (i = 0; i < newValue.length; i += 1) {
        if ($scope.func(newValue[i])) {
            $scope.numberOfShownItems += 1;
        }
    }

    $scope.qVisible = !!$scope.numberOfShownItems;
}

$scope.items = [1,2,3,4,5,6];    

$scope.func = function (item) {
    if (item % 2 === 0) {
        return true;
    }

    return false;
}

$scope.$watch('items', update);

示例:http: //jsfiddle.net/EgZak/

于 2013-04-25T09:31:23.423 回答