title: How to add a specific class to a nav bar based on its component using angular 5
body: <p>How to add a specific class to a nav bar based on its component using angular 5</p>
  
  <p>Basically, I'm trying to create an Angular 5 App. Now in this app, I've multiple components like <code>HomeComponent</code>, <code>AboutComponent</code>, <code>ContactComponent</code>. Now I want my nav bar's background completely transparent in the Home Component but black in other components.</p>
  
  <p>I'm using bootstrap 4 also in this project. So in other components, I just want to add <code>bg-primary</code> class to my navbar and in the home component, I just want to remove that class and some CSS styles.</p>
  
  <p>how can I achieve it?</p>
  
  <p>Here is the code for my nav bar</p>
  
  <pre><code>&lt;nav class="navbar navbar-expand-lg navbar-dark text-uppercase bg-primary w-100 position-fixed"&gt;
      ........
      .......
  &lt;/nav&gt;
  </code></pre>