title: Routing in Angular 4, make active Link background color change
body: <p>I have a sidebar like this :</p>
  
  <pre><code>        &lt;li class="nav-item collapsed side" data-toggle="collapse" data-target="#home" &gt;&lt;li class="nav-item side"&gt;
              &lt;a class="nav-link" href routerLinkActive="active" routerLink=""&gt;Home &lt;span class="sr-only"&gt;(current)&lt;/span&gt;&lt;/a&gt;
          &lt;/li&gt;             
          &lt;ul class="sub-menu collapse" id="home"&gt;
  
                &lt;li class="nav-item list-unstyled"&gt;&lt;a class="nav-link" href  routerLink="home/submenu-1"&gt;Submenu1&lt;/a&gt;&lt;/li&gt;
                &lt;li class="nav-item list-unstyled"&gt;&lt;a class="nav-link" href  routerLink="home/submenu-2"&gt;Submenu2/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;li class="nav-item side"&gt;
              &lt;a class="nav-link" routerLink="firstOption"&gt;First Option&lt;/a&gt;
           &lt;/li&gt;
           &lt;li class="nav-item side"&gt;
               &lt;a class="nav-link"href routerLinkActive="active" routerLink="history"&gt;Second Option&lt;/a&gt;
           &lt;/li&gt;
  </code></pre>
  
  <p>How do I make it, that when I click on the FirstOption, the background color of FirstOption changes,showing that it is active.
  Because I can navigate through the options, I just can't change the background color when the list is active.
  Also, I want the sub-menu of the first home, to remain open when I have submenu1 or submenu2 open.</p>
  
  <p>Thank you.</p>