我的 ng-click($index) 上没有子菜单 show/hide

Question

我想在我的网站上做一个树状菜单。单击父项时，我希望子项为 show/hide。此解决方案不起作用。即使它将 item.active 值更改为 false/true。我的朋友们有什么想法吗？

这是我的 HTML:

<div id="sidebar-wrapper">
<div class="cssTreeMenu tree">
    <ul class="sidebar-nav">
         <li ng-repeat="item in items" >
            <a ui-sref="{{item.sref}}" ui-sref-active="active" ng-click="testcolaps($index)">{{item.name}}</a>              
            <ul ng-show="{{item.active}}" class="navbarColorOnClick">
                <li ng-repeat="subItem in item.subItems" ui-sref-active="active">
                    <a ui-sref="{{subItem.sref}}">{{subItem.name}}</a>
                </li>
            </ul>
        </li>
    </ul>
</div>

这是我的控制器：

 $scope.testcolaps = function (index) {
    $scope.items[index].active = !$scope.items[index].active;     
};

$scope.items = [
    {
        name: "Test",
        sref: "kpi.test",
        active: false,
        subItems: [
            {
                name: "Selectable KPI menu",
                sref: "kpi.selectableKpiMenu"
            },
            {
                name: "Test",
                sref: "kpi.test"
            }
        ]
    },
     {
         name: "Test2",
         sref: "kpi.test",
         active: false,
         subItems: [
             {
                 name: "Selectable KPI menu 2",
                 sref: "kpi"
             },
             {
                 name: "Test 2",
                 sref: "internal"
             }
         ]
     },
];

如您所见，我的物品有一个 active: 属性，我将其更改为 true/false。但是我的菜单中仍然没有任何反应。如果我将它硬编码为真，它会像它应该的那样显示，但点击事件仍然不起作用。

Answer 1

ng-show 中的表达式需要一个没有 {{}} 插值的表达式。基本上你需要删除 {{}}.

ng-show="item.active"

我的 ng-click($index) 上没有子菜单 show/hide

Submenu doesn´t show/hide on my ng-click($index)

menu

submenu

angularjs