Question

如果ul为空，我想隐藏它们：

<div class="nav-manage clearfix" ng-app="linksManager">

    <script type="text/ng-template" id="inner-list.html">

        <li ng-repeat='link in link.submenu'>
            <a href="{{link.url}}">{{link.text}}</a>
            <div ng-switch on="link.submenu">
                <ul class="sortable" ng-include="'inner-list.html'">
            </div>
        </li>

    </script>

    <div class="links-arrange" ng-controller="linksRarrange">
        <ul class="sortable">
            <li ng-repeat="link in links">
                    <a href="{{link.url}}">{{link.text}}</a>
                    <div ng-switch on="link.submenu">
                        <ul class="sortable" ng-include="'inner-list.html'"></ul>
                    </div>
            </li>
        </ul>
    </div>

但无论ng-switch on

中的内容如何，它们都不会被隐藏

这是数据结构：

var linksData = [
    {
        text: 'Menu Item 1',
        url: '#'
    }, {
        text: 'Menu Item 2',
        url: '#',
        submenu: [
            {
                text: 'Sub-menu Item 3',
                url: '#'
            }, {
                text: 'Sub-menu Item 4',
                url: '#',
                submenu: // etc ...
];

Answer 1

ng-switch的工作原理是... ... javascript switch，您需要使用ng-switch on和ng-switch-when才能使用它（请查看示例here）。但是，在这种情况下，ng-switch似乎不是一个好的解决方案，您需要的是AngularUI ui-if指令（src代码here）：

什么？完全从DOM中删除元素而不是隐藏   它

为什么？在DOM遍历很重要的情况下（例如CSS）   选择器：first-child，：last-child和：nth（） - child），只是隐藏   元素是不够的。

示例：

<div ui-if="link.submenu">

jsfiddle ：http://jsfiddle.net/bmleite/fBLTd/

ng-switch总是如此

1 个答案: