Question

所以我有一个mapA容器div，里面有一堆图像。对于每个图像，旁边都有一个div。我只希望最终图像的div可见，我使用ng-repeat实现了这一点。这就像一个魅力。

现在我在页面中也有一个过滤器按钮，当点击此按钮时，其中一些图像会被隐藏。此显示/隐藏是使用图片代码上的$last完成的。

我想要的是，当点击过滤按钮并隐藏一些图像时，我希望显示最终可见图像旁边的div。好像ng-show似乎不知道ng-show / hide值。如何处理它以便仍然显示最后一个可见图像旁边的div？

$last

非常感谢任何帮助！

Answer 1

您可以使用角度内置的ng-repeat过滤器来过滤ng-repeat，而不是使用ng-show。如果你的getFilterValue函数返回一个布尔值，这应该适合你。那么你的$ last应该根据符合过滤条件的内容知道最后的内容。

<div class='container' ng-repeat="image in album | filter:getFilterValue(image.imageId)">
   <div class='wrapper'>
     <div><img src='{{image.src}}'></div>
     <div class='embellish-end' ng-class='{'hidden':!$last}'>The End</div>
   </div>
</div>

Answer 2

尝试将ng-show放在图像而不是整个div包装器上：

<div class='container' ng-repeat="image in album">
  <div class='wrapper'>
    <div ng-show="getFilterValue(image.imageId)"><img src='{{image.src}}'></div>
    <div class='embellish-end' ng-class='{'hidden':!$last}'>The End</div>
  </div>
</div>

不相关：使用 ng-src 而非 src 时，请使用角化图像源以避免浏览器错误。

Angular：使用$ last来使用ng-show获取最后一个元素

2 个答案: