获取 ng-Show 显示的列表长度答案

【问题标题】：Get the length of list shown by ng-Show获取 ng-Show 显示的列表长度
【发布时间】：2016-11-24 04:31:41
【问题描述】：

我正在使用 Vraptor + Angular，问题很简单。我用 ng-show 在表中隐藏了一些行，但我想计算实际显示行的计数/长度。

示例：我在 $data 上有 10 条记录。但是当我使用 ng-show 时，它只显示 5 条记录。当我使用 $data.length 时，它返回 10，但我希望它返回 5。

表格：

<table data-ng-table="$tableUsuario.params">
    <tbody >
        <tr data-ng-repeat="usuario in $data | filter:search:strict" 
         data-ng-show="usuario.ativo == filtroAtivo && (filtroPerfil == null || usuario.perfil == filtroPerfil )">

【问题讨论】：

目前还不清楚您要在这里完成什么。在同一个ng-repeat 中同时使用filter 和ng-show 有点多余。如果您仅使用过滤器，则可以为过滤器结果设置别名，但如果您想通过过滤掉ng-show 来进一步减少计数，则必须编写自己的算法算出计数。

标签： angularjs ngtable

【解决方案1】：

我对这个问题有点困惑，但你可以使用：

$data.length 获取您的数据总数。

ng-repeat 的$index 获取当前行/长度。

然后您可以在 ng-show 中使用这两个值。

【讨论】：

示例：我在 $data 上有 10 条记录。但是当我使用 ng-show 时，只显示 5 条记录。当我使用 $data.length 时，返回 10。但我想要返回 5。明白了吗？
啊，好的。然后就像@vittore 提到的那样，您可能需要自己的自定义过滤器或创建一个新的范围变量。

【解决方案2】：

事情是这样的，一方面您可以检查 DOM 并查看您有多少可见行，这将回答您的问题，但这是一个非常糟糕的解决方案，这会使您的 Angular 应用程序的性能更差，而不是真正的 Angular - 做事的方式。

您的另一个选择是创建自己的过滤器并使用它，在这种情况下，您将能够知道过滤器中有多少项目。

我认为最好的第三个选项是创建另一个范围变量并仅使用过滤后的项目填充它，当然您需要将其与主列表保持同步，您可以使用$watch和 $watchCollection 范围内的方法

.... 
$scope.$data = [ ...]

function ativoOrPerfil(item) {
  return item.ativo == filtroAtivo && (filtroPerfil == null || item.perfil == filtroPerfil )

}

function updateFiltered() {
   $scope.$dataFiltered = $scope.$data.filter(ativoOrPerfil)
}

$scope.$watch('filtroAtivo', updateFiltered)
$scope.$watch('filtroPerfil', updateFiltered)

虽然请记住，由于您使用的是严格过滤器，然后是您自己的过滤器，您需要调整 updateFiltered 以包含您拥有的所有 3 个条件 - 过滤器、ativo 和危险

【讨论】：

感谢您的回答和解释。我想我会创建自己的过滤器并停止使用 ng-show。