Question

JS代码

var id = 1;
if (id == 2) {
    $scope.leftLinks = [{
       Text: "Register",
       Url: "/register"
    }, {
       Text: "Login",
       Url: "/"
    }];
}
else {
    $scope.leftLinks = 
    [{
        subMenus: [
            {
                Text: "Profile",
                Url: "/profile"
            },
            {
                Text: "Change Password",
                Url: "/change-password"
            },
            {
                Text: "Logout",
                Url: "#"
            }
        ]
    }];
}

标记

<nav class="navbar navbar-default" role="navigation">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" ng-init="navCollapsed = true" ng-click="navCollapsed = !navCollapsed">
        <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="#">Brand</a>
    </div>
    <div class="collapse navbar-collapse" uib-collapse="navCollapsed">
      <div class="collapse navbar-collapse" uib-collapse="navCollapsed">
        <ul class="nav navbar-nav navbar-right">
          <li ng-repeat="leftLink in leftLinks">
            {{leftLink.Text}}
            <a href="{{leftLink.Url}}" ng-hide="leftLink.subMenus">{{leftLink.Text}}</a>

            <a href="javascript:void(0)" role="button" area-haspopup="true" area-expanded="false" uib-dropdown-toggle ng-show="leftLink.subMenus">Hello               
                            <b class="caret"></b>
                        </a>
            <ul class="dropdown-menu" role="menu" ng-show="leftLink.subMenus">
              <li ng-repeat="subMenu in leftLink.subMenus">
                <a href="#!{{subMenu.Url}}">{{subMenu.Text}}</a>
              </li>
            </ul>

          </li>
        </ul>
      </div>
    </div>
  </nav>

问题

单击导航栏，然后单击Hello：它不显示li项目

请建议。

Answer 1

很明显，您使用带有引导程序组件的click事件需要引导程序javascript文件。你必须包括它。然后你必须在菜单上添加一个触发器。我相信菜单应该是这样的：

 <div class="dropdown">
   <a  role="button" href="#" class="dropdown-toggle" 
   data-toggle="dropdown" >Hello <b class="caret"></b>
   </a>
   <ul class="dropdown-menu" role="menu" ng-show="true">
      <li>
         <a href="#">item 1</a>
      </li>
      <li>
         <a href="#">item 2</a>
      </li>
      <li>
         <a href="#">item 3</a>
      </li>
   </ul>

这是一个小小的Plunker弄清楚你的问题plunker。

我希望有帮助

点击插入符号不显示li项目

1 个答案: