html - 我怎样才能简单地从 AngularJS 的子菜单中切换/隐藏菜单

Question

所以我通读了一些堆栈，发现我必须创建单独的指令来隐藏/切换子菜单项中的菜单。

我希望在单击任何子菜单项时隐藏菜单。

但我觉得必须有更简单的方法，想知道是否有人知道是否有？

截至目前，我已将我的代码设置为列出创建选项卡并为其分配值的元素。选择子菜单项时，它会隐藏除所选选项卡值之外的所有选项卡。这样就不会重新加载页面，也不会传递任何参数。

<a href ng-click="toggle = !toggle">=</a>
<ul ng-show="toggle">
  <li><a id="Home" ng-click="navi.selectTab(1)">Home</a></li>
  <li><a id="About" ng-click="navi.selectTab(2)">About</a></li>
  <li><a id="Contact" ng-click="navi.selectTab(3)">Contact</a></li>
</ul>

...<div ng-show="navi.isSelected(1)">...
...<div ng-show="navi.isSelected(2)">...
...<div ng-show="navi.isSelected(3)">...

我希望快速修复。我附上了一个带有 plunkr 的函数原型(prototype): HERE

同样，这只是一个原型(prototype)。最终版本将被幻想起来。我只是在寻找功能建议。

Answer 1

如果我理解正确，那么你可以这样做:

<a href ng-click="toggle = !toggle">=</a>
<ul ng-show="toggle">
  <li><a id="Home" ng-click="navi.selectTab(1); toggle = false">Home</a></li>
  <li><a id="About" ng-click="navi.selectTab(2); toggle = false">About</a></li>
  <li><a id="Contact" ng-click="navi.selectTab(3); toggle = false">Contact</a></li>
</ul>

或者创建一个同时执行这两项操作的函数 - selectTab(index) 和 toggle = false 。并在 ng-click

中调用它