Vfrdtyky

I already had another question concerning this topic > Dropdown in Angular6 with Bootstrap 4.1.3 does not work

There I came to the following solution, but I would like to know how to replace those scripts with Angular-own code.

old solution: HTML + adding scripts to the index.html of the angular-app

<nav class="navbar navbar-light bg-light mb-5 fixed-top">

      <a class="navbar-brand" href="#">Title</a>

        <div class="navbar-expand mr-auto">

        <div class="navbar-nav">

          <ul class="nav nav-pills">

            <li class="nav-item">

              <a class="nav-link" routerLink="/dashboard">Main Page</a>

            </li>

            <li class="nav-item">

              <a class="nav-link" routerLink="/about">About</a>

            </li>

          </ul>

        </div>

      </div>

      <div class="navbar-expand ml-auto">

        <div class="navbar-nav">

          <ul class="nav nav-pills">

            <li class="nav-item dropdown">

              <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">Login</a>

              <div class="dropdown-menu">

                <a class="dropdown-item" routerLink="/signin">My Profile</a>

                <div class="dropdown-divider"></div>

                <a class="dropdown-item" routerLink="/signup">Register</a>

              </div>

            </li>

          </ul>

        </div>

      </div>

    </nav>

and in the index.html I've added those scripts.

  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>