Угловой 2 Bootstrap 4 navbar, отображающийся вертикально не горизонтально

Question

Когда вы следуете инструкциям Angular 2 on Rails 5, которые реализуют загрузку 4, я построил Navbar точно так, как это было сделано в учебнике, но почему-то мой навигатор появляется вертикально, когда он должен появляться горизонтально , Любые идеи по устранению этой проблемы? Заранее спасибо

<nav class="navbar navbar-fixed-top navbar-light bg-faded"> 
 
    <div class='container'> 
 
     <ul class="nav navbar-nav"> 
 
      <li class='nav-item'> 
 
       <a class='nav-link' routerLink="/home" routerLinkActive="active">Home</a> 
 
      </li> 
 
      <li class='nav-item'> 
 
       <a class='nav-link' routerLink="/documents" routerLinkActive="active">Docs</a> 
 
      </li> 
 
      <li class="nav-item dropdown"> 
 
       <div ngbDropdown class="d-inline-block dropdown-links"> 
 
        <button class="btn btn-outline-primary" id="proposalDropdown" ngbDropdownToggle> 
 
         Proposals 
 
        </button> 
 
        <div class="dropdown-menu" aria-labelledby="proposalDropdown"> 
 
         <a class="dropdown-item" routerLink="/proposals" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true}">Proposals</a> 
 
         <a class="dropdown-item" routerLink="/proposals/new" routerLinkActive="active">New Proposal</a> 
 
        </div> 
 
       </div> 
 
      </li> 
 
     </ul> 
 
    </div> 
 
</nav>

Answer 1

Добавить navbar-toggleable-sm (md/lg) для nav элемента, чтобы сделать его по горизонтали до sm, в противном случае он будет оказывать вертикальный каждый раз.

<nav class="navbar navbar-toggleable-sm navbar-fixed-top navbar-light bg-faded"> 

    .... 

</nav> 

Demo Plunker