Question

我有一个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？

Answer 1

我将假设你的某个地方看起来像是......

<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的情况下完成此操作的方法。

Answer 2

你可以让$ watch听同样的数据-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/

完成ng-hide后添加功能

2 个答案: