在"ng-repeat"内部使用"ng-show"，

Question

我正在使用AngularJS开发Web应用程序。 应用程序显示表中的项目列表。

这是打印表的代码：

<table>
<tr ng-repeat="x in content.listaOperaciones>
<td>{{ x.idOperacion }} </td>
<td>{{ x.idGan }}</td>
<td>{{ x.idEm}}</td>
<td>{{ x.idGate}}</td>
<td>{{ x.idRf }}</td>
<td>{{ x.peso }}</td>
<td>{{ x.duracion }}</td>
<td>{{ x.timestampInicioOperacion | date:'dd-MM-yy HH:mm'}}</td>      
</tr>
</table> 

这就是表格在 html 中打印后的外观。

我想通过使用一些用户可以访问的变量在表中的每个元素中实现多个过滤器。

我的想法是通过使用"ng-show"或"ng-if"语句过滤"ng-repeat"语句中的每个元素。

这是用户可以修改变量的 html 代码：

<input ng-model="tiempoMinimo">
<input ng-model="$ctrl.PesoMinimo">
<input ng-model="$ctrl.PesoMaximo">

这就是我修改表构造函数的方式：

<tr ng-repeat="x in content.listaOperaciones | orderBy : $ctrl.orderProp | filter:$ctrl.Busc" ng-if="x.peso > $ctrl.PesoMinimo && x.peso < $ctrl.PesoMaximo">
<div ng-show="x.duracion < $parent.tiempoMinimo">
<td>{{ x.idOperacion }} </td>
<td>{{ x.idGan }}</td>
<td>{{ x.idEm}}</td>
<td>{{ x.idGate}}</td>
<td>{{ x.idRf }}</td>
<td>{{ x.peso }}</td>
<td>{{ x.duracion }}</td>
<td>{{ x.timestampInicioOperacion | date:'dd-MM-yy HH:mm'}}</td>
</tr>

使用"ng-repeat"中的"ng-if"进行过滤是有效的。

使用嵌套在"ng-repeat"循环中的"ng show"进行过滤不起作用...

由于我想使用多个过滤器(可能是 10 或 20(，我更喜欢使用嵌套在"ng-repeat"循环中的"ng-show"指令，所以代码希望更容易理解......

在这里，您可以摆弄源代码的工作： https://jsfiddle.net/DSG00/f94sjtty/

提前谢谢你。 迪达克

Answer 1

你的小提琴不起作用，因为你不能在tr里面使用div。将ng-show移动到ng-repeat所在的tr元素。还要像这样更改条件!$parent.tiempoMinimo || x.peso > $parent.tiempoMinimo这样当您的输入为空时，它不会隐藏整个表。