theme.directive.ts

import { Directive, Input, OnInit, ElementRef, Renderer2 } from '@angular/core';
import { ThemeService } from './theme.service';

@Directive({
  selector: '[appTheme]' 
})
export class ThemeDirective implements OnInit {
  @Input('appTheme') appTheme: string; // appTheme="customClassKey"
  constructor(
    private themeService: ThemeService,
    private el: ElementRef,
    private renderer: Renderer2) {
  }
  ngOnInit() {
    const name = this.appTheme || this.el.nativeElement.localName;
    const className = this.themeService.getClass(name); // get class name from theme service
    if (className) {
      this.renderer.addClass(this.el.nativeElement, className); // apply class
    }
  }
}