Angular2タグでブートストラップの折りたたみが機能しない

Question

角型シードを使用しています。今では折りたたまれたメニューが必要です。

私はブートストラップを使用しています。私は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/

親切に私を助けて。それは動作していません

Answer 1

ブートストラップはいくつかのコンポーネントのためにjQueryが必要なので。 bootstrap-without-jqueryまたは Native Angular widgets for Bootstrap 3 and Bootstrap 4