AngularJS：选择父li时渲染子li

Question

我有一个要求，我只需要显示所选li的子项。 防爆。在下面显示的图像中，选中了 EIS_ASCP_FORECAST_SETS_V ，因此显示了它的子FND_USER和MRP_FORECAST_DESIGNATORS_V，并隐藏了其余元素。同样，当选择FND_USER时，必须显示它的子项。树是使用jquery创建的并且是动态的。我在页面的其余部分使用AngularJS。

我尝试使用$(event.target).parent().find('li')，但无法从中获取子元素。

形成树的代码

<li class="treeView">
<a ng-click="getViewColumns('EIS_ASCP_FORECAST_SETS_V', '724')" href=""><b>EIS_ASCP_FORECAST_SETS_V</b></a>&nbsp;<input type="checkbox" ng-checked="true" ng-click="useInSelect('EIS_ASCP_FORECAST_SETS_V')">
    <ul>
        <li><a ng-click="getViewColumns('FND_USER', '724')" href="">FND_USER</a>&nbsp;<input type="checkbox" ng-click="useInSelect('FND_USER')">
        <li><a ng-click="getViewColumns('MRP_FORECAST_DESIGNATORS_V', '724')" href="">MRP_FORECAST_DESIGNATORS_V</a>&nbsp;<input type="checkbox" ng-click="useInSelect('MRP_FORECAST_DESIGNATORS_V')"></a>
    </ul>

Answer 1

您可以将ng-if="showHideComp(parentId)"添加到子元素。并在showHideComp（）函数内部检查parentId的isSelected属性并相应地返回true / false。

示例：

<input type="checkbox" ng-model="checked" ng-init="checked=true" /></label><br/>

选中时显示：

<span ng-if="checked" class="animate-if">
   This is removed when the checkbox is unchecked.
</span>