how to add style into component depending on body class in Angular 6

[Rakesh Roy]

app.component.ts

import { Component, Renderer2 } from '@angular/core';
import { Router, NavigationStart } from '@angular/router';

@Component({
  selector: 'bb-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})




export class AppComponent {
  title = 'bb';
  previousUrl: string;


  constructor(private renderer: Renderer2, private router: Router) {
    this.router.events
      .subscribe((event) => {


        if (event instanceof NavigationStart) {
          if (this.previousUrl) {
            this.renderer.removeClass(document.body, this.previousUrl);
          }
          const currentUrlSlug = event.url.slice(1);
          if (currentUrlSlug) {
            this.renderer.addClass(document.body, currentUrlSlug);
          } else {
            this.renderer.addClass(document.body, "home");
          }
          this.previousUrl = currentUrlSlug;
        }
      });


  }




}

i added a body class depending on the route. and depending on the body class i ave to cane header color.

So how can i add css and where 

[Sander Elias]

Hi Rakesh,

There are s couple of ways to accomplish this. Disabling emulated view encapsulation is the easiest. Then just use normal CSS to address your issue.

Regards

Sander