title: Angular 4 Bootstrap nav bar not working with dynamic binding
body: <p>I am using Angular 4 and Bootstrap 3.3. With static data Left Navbar is working fine. but when i get menu items from DB and try to use *ngFor Navbar is loading but collapse is not working.</p>
  
  <p>Code Snippet:</p>
  
  <pre><code>&lt;div id="sidebar-wrapper" &gt;
      &lt;nav id="spy"&gt;
          &lt;ul class="sidebar-nav nav" id="side-menu" &gt;
              &lt;li &gt;
                  &lt;a href="#"&gt; Survey&lt;span class="fa arrow"&gt;&lt;/span&gt;&lt;/a&gt;
                  &lt;ul class="nav nav-second-level"&gt;
                      &lt;li&gt;
                          &lt;a href="#"&gt;Event Details&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;a href="#"&gt;Event History&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;a href="#"&gt;Event Summary&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;a href="#"&gt;Notes&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;a href="#"&gt;Back Out&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;a href="#"&gt;Print Form&lt;/a&gt;
                      &lt;/li&gt;
  
                  &lt;/ul&gt;
              &lt;/li&gt;
              &lt;li *ngFor="let menu of navmenuData"&gt;
                  &lt;a class="nav-link"
          [routerLink]=""&gt; {{ menu.MenuName }} &lt;span class="fa arrow"&gt;&lt;/span&gt;&lt;/a&gt;
                  &lt;ul *ngIf="menu?.children?.length&gt;0"  [ngClass]="{'nav nav-second-level collapse':menu.children.length&gt;0}"&gt;
                      &lt;li  *ngFor="let submenu of menu?.children"&gt;
                          &lt;a class="nav-link"
          [routerLink]=""&gt;{{ submenu.MenuName }}&lt;/a&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/nav&gt;
  &lt;/div&gt;
  </code></pre>