javascript - 使用Angular的树有时会深入5个级别，有时会少一些，当它减少时需要jquery隐藏

使用角度的树有时会深5层，有时会少一些，当深度少于5层时，我需要一个jQuery选择器来隐藏按钮。

请参考代码段。

groupToggle函数显示或隐藏子项，并将+更改为负数，反之亦然。

.clsGrpToggle函数是我遇到问题的地方。我不确定如何使控制器在代码段中工作。

function groupToggle(symbolObj) {
        var symbolTxt = $(symbolObj).text();
        if (symbolTxt == "+") {
            $(symbolObj).text("-");
//            $(".groupList").show();  //shows all
            $(symbolObj).siblings(".groupList").show();
        }
        if (symbolTxt == "-") {
            $(symbolObj).text("+");
//            $(".groupList").hide();  //hides all
            $(symbolObj).siblings(".groupList").hide();
        }
    }

$(".clsGrpToggle").each(function() {
            if($(this).closest("li").has("ul")){
                console.log("if " + $(this).siblings().html());
//                $(this).hide();
            }
            else {
                console.log("else " + $(this).siblings().html());
//                $(this).hide();

            }
        });

.controller('MockRbacGroupController', function($scope, $routeParams) {

        $scope.roles = [
            {

                name: "role1"
            },

            {
                name: "role2"
            }];
        $scope.users = [
            {
                role: "role1",
                subUsers: [{
                    name: "agent1"
                },
                    {
                        name: "agent2"
                    }]

            }
        ];

    })

<table style="width: 100%; position: absolute; top: 232px; left: 870px;" ng-controller="mockRbacGroupController">
        <tr>
            <th>Roles</th>
        </tr>
        <tr ng-repeat="group in groupList | orderBy:'group'">
            <td>
                <button onclick="groupToggle(this);" class="clsGrpToggle">&#43;</button>&nbsp;{{group.name}}
                <ul class="groupList" style="display: none;" ng-repeat="group in group.children">
                    <li><button onclick="groupToggle(this);" class="clsGrpToggle">&#43;</button>&nbsp;{{group.name}}
                        <ul class="groupList" style="display: none;" ng-repeat="group in group.children">
                            <li><button onclick="groupToggle(this);" class="clsGrpToggle">&#43;</button>&nbsp;{{group.name}}
                                <ul class="groupList" style="display: none;" ng-repeat="group in group.children">
                                    <li><button onclick="groupToggle(this);" class="clsGrpToggle">&#43;</button>&nbsp;{{group.name}}
                                        <ul class="groupList" style="display: none;" ng-repeat="group in group.children">
                                            <li>{{group.name}}</li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </td>
        </tr>
    </table>

最佳答案

解决方案是按钮上的ng-if =“ group.children.length”。感谢charlieftl提供了答案。