Javascript 如何在AngularJS中循环数组时隐藏空值字段

我有一些存储在数据库中的值，这些值是从网站的表单中提取的。。有时某些字段可能为空值或为空

当我使用PHP json encode打印我的值时。。它打印数组中的所有值

我在AngularJS工厂中成功地获得了该信息，但当我尝试使用ng Repeat显示值时，它也接受空值

我想做的是在循环时完全隐藏空值

未显示的图像是空值的图像。我想将其全部隐藏

---

您只需在图像标签上使用ng show即可实现这一点：- 比如说

<div ng-repeat="post in posts">
          <strong ng-show="post.tag!=null">{{post.tag}}</strong>   //You use <img ng-show="image!=null" src="./."></img>
        </div>

结果:-

技术人员

运动

---

Fiddle:-

如果标记未定义或为空，则可以使用

隐藏元素。

所有当前答案都建议直接在HTML代码中指定。然而，这不是一个正确的解决方案

最干净的方法是创建自己的过滤器——这样，在将来，如果您有另一个不要求图像显示（例如）图像是否为png类型的要求，那么您可以简单地在过滤器中添加逻辑，而不会弄乱HTML。此外，这种方法甚至不将图像添加到DOM中—使用

ng show

将元素添加到DOM中，但将其隐藏—对于大型数据来说，这不是一个好的解决方案

因此，在您的例子中，最佳实践是创建一个过滤器函数。 如果您的HTML代码是-

<div data-ng-repeat="image in images | filter:hideImage"></div>

---

最后，我实现了我自己的过滤器，因为数组在其中包含一个数组。。我必须使用jQuery手动绘制它，然后通过增益循环。。 下面是我使用的过滤器代码：

diary.filter('TextFilter', function () {
    return function (Notes) {
        var filtered = [];
        for (i = 0; i < Notes.length; i++)
        {
            var note = Notes[i];
            if (note.text_notes != ''){
                filtered.push(note);
            }
        }
        return filtered;
    }
});

diary.filter（'TextFilter'，函数（）{
返回函数（注释）{
var筛选=[]；
对于（i=0；i

现在它不会显示图像，但会留下空白，因为div在没有图像的情况下重复。。我相信如果有任何过滤器可以跳过重复空数据..是的，通过对repeat div应用ng show，它成功了：）谢谢你的评论。。会跟随你们两个的建议。在这种情况下，过滤器是一个更好的解决方案。我正在寻找一个基本的解决方案。。我正要问这个问题，你回答了。。谢谢lot@ChanX您是否放置了一个控制台语句并检查是否调用了您的函数？

$scope.hideImage = function (image) {
    //Function will be called for each image
    //Function returns true or false
    //false - don't add image to DOM (actually, don't make image part of images)
    //true - add image to DOM
    if (image) {
        //image exists.
        return true;
    } else {
        return false;
    }
};

diary.filter('TextFilter', function () {
    return function (Notes) {
        var filtered = [];
        for (i = 0; i < Notes.length; i++)
        {
            var note = Notes[i];
            if (note.text_notes != ''){
                filtered.push(note);
            }
        }
        return filtered;
    }
});