バージョン

Angular 11 Bootstrap 5

手順①npm install

npm install bootstrap jquery

手順②angular.jsonを編集

```angular.json "styles": [ "./node_modules/bootstrap/dist/css/bootstrap.css", "src/styles.css" ], "scripts": [ "./node_modules/jquery/dist/jquery.js", "./node_modules/bootstrap/dist/js/bootstrap.js" ]


<h1>手順③bootstrap公式ドキュメントからごっそりコピペ</h1>
https://getbootstrap.com/docs/5.0/components/navbar/

```app.component.html
<div class="collapse" id="navbarToggleExternalContent">
  <div class="bg-dark p-4">
    <h5 class="text-white h4">Collapsed content</h5>
    <span class="text-muted">Toggleable via the navbar brand.</span>
  </div>
</div>
<nav class="navbar navbar-dark bg-dark">
  <div class="container-fluid">
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
  </div>
</nav>

デモ

![hamburger menu.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630191/20f9d584-75e6-d025-d8a5-61c2c8534178.gif)