bootstrap崩溃无法使用Angular2标记

时间:2017-04-18 13:30:15

标签: angular

我正在使用角度种子高级,现在我想要一个折叠的菜单。

我正在使用bootstrap。我不想使用Jquery。

  <!-- inject:css -->


  <!-- endinject -->


      <nav _ngcontent-c0="" class="navbar navbar-default">
        <div _ngcontent-c0="" class="container-fluid">
          <div _ngcontent-c0="" class="navbar-header">
            <button _ngcontent-c0="" aria-controls="navbar" aria-expanded="false" class="navbar-toggle collapsed" data-target="#navbar" data-toggle="collapse" type="button">
              <span _ngcontent-c0="" class="sr-only">Toggle navigation</span>
              <span _ngcontent-c0="" class="icon-bar top-bar"></span>
              <span _ngcontent-c0="" class="icon-bar middle-bar"></span>
              <span _ngcontent-c0="" class="icon-bar bottom-bar"></span>
            </button>
            <a _ngcontent-c0="" class="navbar-brand" href="#">Project name</a>
          </div>
          <div _ngcontent-c0="" class="navbar-collapse collapse" id="navbar">
            <ul _ngcontent-c0="" class="nav navbar-nav">
              <li _ngcontent-c0="" class="active"><a _ngcontent-c0="" href="#">Home</a></li>
              <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">About</a></li>
              <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">Contact</a></li>
              <li _ngcontent-c0="" class="dropdown">
                <a _ngcontent-c0="" aria-expanded="false" class="dropdown-toggle" data-toggle="dropdown" href="#" role="button">Dropdown <span _ngcontent-c0="" class="caret"></span></a>
                <ul _ngcontent-c0="" class="dropdown-menu" role="menu">
                  <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">Action</a></li>
                  <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">Another action</a></li>
                  <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">Something else here</a></li>
                  <li _ngcontent-c0="" class="divider"></li>
                  <li _ngcontent-c0="" class="dropdown-header">Nav header</li>
                  <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">Separated link</a></li>
                  <li _ngcontent-c0=""><a _ngcontent-c0="" href="#">One more separated link</a></li>
                </ul>
              </li>
            </ul>
            <ul _ngcontent-c0="" class="nav navbar-nav navbar-right">
              <li _ngcontent-c0="" class="active"><a _ngcontent-c0="" href="./">Default <span _ngcontent-c0="" class="sr-only">(current)</span></a></li>
              <li _ngcontent-c0=""><a _ngcontent-c0="" href="../navbar-static-top/">Static top</a></li>
              <li _ngcontent-c0=""><a _ngcontent-c0="" href="../navbar-fixed-top/">Fixed top</a></li>
            </ul>
          </div>
        </div>
      </nav>

http://jsfiddle.net/fehr739r/

请帮助我。它无法正常工作

1 个答案:

答案 0 :(得分:0)

因为Bootstrap需要某些组件的jQuery。 您可以使用bootstrap-without-jqueryNative Angular widgets for Bootstrap 3 and Bootstrap 4