如果 AngularJS 中没有可见的子元素，如何隐藏 div？答案

【问题标题】：How do I hide a div if there are no visible children in AngularJS?如果 AngularJS 中没有可见的子元素，如何隐藏 div？
【发布时间】：2015-03-11 16:28:58
【问题描述】：

如果子项全部不可见，我会尝试隐藏父 div。如果没有孩子，我可以隐藏父母，但无法根据可见性确定如何隐藏；

<div ng-repeat="group in section.groups" ng-show="group.fields.length > 0">
 <input  ng-if='field.isVisible' type="text" name="{{ field.id }}" id="{{ field.id }}" ng-model="field.value" /> 
</div>

有人可以提供一个示例，说明如何仅在存在满足 field.isVisible 的 ng-if 条件的输入时才显示外部 div？

谢谢，布赖恩

【问题讨论】：

不能只用JS/Jquery判断children是否可见然后设置div的可见性吗？
另外，如果所有的孩子都是不可见的，那么隐藏父 div 的意义何在？
你可以简单地在 CSS 中设置width:auto;height:auto; 吗？或者干脆跳过width 和height 规则。
如果我使用 CSS 或内联样式，元素仍会在 DOM 上呈现。我的要求是元素根本不应该存在，除非 Angular 模型数据中存在子元素。

标签： javascript jquery html angularjs visibility

【解决方案1】：

啊，我一发布问题就意识到我可以根据属性进行过滤，然后检查长度如下；

<div ng-repeat="group in section.groups" ng-show="(group.fields | filter:{isVisible:true}).length > 0">
 <input  ng-if='field.isVisible' type="text" name="{{ field.id }}" id="{{ field.id }}" ng-model="field.value" /> 
</div>

【讨论】：