Question

我希望我的bootstrap和angular app菜单在选择后用动画折叠，然后让处理程序进行导航。（我很困惑为什么菜单在选择时不会默认关闭。）

我已经找到了如何在角度应用程序中执行jquery的东西，以及如何在jquery应用程序中执行菜单内容，所以我正在尝试将这两个问题的解决方案结合起来：

（菜单，但没有角度）Hide Twitter Bootstrap nav collapse on click
（anugular，但不是菜单）How to trigger ng-click [AngularJS] programmatically

我的HTML看起来像这样......

      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#js-navbar-collapse">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#/" ng-bind="title"></a>
      </div>

      <div class="collapse navbar-collapse" id="js-navbar-collapse">
        <ul class="nav navbar-nav">
          <li ng-repeat="menuItem in menuItems" ng-click="selected(menuItem)"><p ng-bind="menuItem.name"></p></li>
        </ul>
      </div>

所以，我认为我的JS应该是这样的......

$scope.selected = function(menuItem) {
    console.log(menuItem);
    $timeout(function() {
        angular.element('#js-navbar-collapse').triggerHandler('click');
      }, 10);
};

但是在尝试了每个选择器和几个jquery方法之后，我无法使它工作。每次结果都是一样的：菜单保持打开状态，我在UI上获得的只是菜单图标的一小部分。

选择后关闭引导菜单

0 个答案: