From b4da33d08a8c5687d078a6dd87da550e4978a3e1 Mon Sep 17 00:00:00 2001
From: Ilya Surmay <ilya.surmay@valor-software.com>
Date: Tue, 25 Jul 2017 16:53:56 +0300
Subject: [PATCH] fix(tabs): fix customClass [fixes #2253]

---
 src/tabs/tab.directive.ts | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/tabs/tab.directive.ts b/src/tabs/tab.directive.ts
index 049bcb4a6e..f357d1ad8f 100644
--- a/src/tabs/tab.directive.ts
+++ b/src/tabs/tab.directive.ts
@@ -1,5 +1,5 @@
 import {
-  Directive, EventEmitter, HostBinding, Input, Output, TemplateRef, OnInit, OnDestroy, ElementRef } from '@angular/core';
+  Directive, EventEmitter, HostBinding, Input, Output, TemplateRef, OnInit, OnDestroy, ElementRef, Renderer } from '@angular/core';
 import { TabsetComponent } from './tabset.component';
 
 @Directive({selector: 'tab, [tab]'})
@@ -13,7 +13,16 @@ export class TabDirective implements OnInit, OnDestroy {
   /** if true tab can be removable, additional button will appear */
   @Input() public removable: boolean;
   /** if set, will be added to the tab's class atribute */
-  @Input() public customClass: string;
+  @Input() public get customClass(): string {
+    return this._customClass;
+  }
+
+  public set customClass(customClass: string) {
+    if (customClass) {
+      this._customClass = customClass;
+      this.renderer.setElementClass(this.elementRef.nativeElement, this._customClass, true);
+    }
+  }
 
   /** tab active state toggle */
   @HostBinding('class.active')
@@ -21,7 +30,7 @@ export class TabDirective implements OnInit, OnDestroy {
   public get active(): boolean {
     return this._active;
   }
-  
+
   public set active(active: boolean) {
     if (this.disabled && active || !active) {
       if (!active) {
@@ -53,8 +62,9 @@ export class TabDirective implements OnInit, OnDestroy {
   public headingRef: TemplateRef<any>;
   public tabset: TabsetComponent;
   protected _active: boolean;
+  protected _customClass: string;
 
-  public constructor(tabset: TabsetComponent, public elementRef: ElementRef) {
+  public constructor(tabset: TabsetComponent, public elementRef: ElementRef, public renderer: Renderer) {
     this.tabset = tabset;
     this.tabset.addTab(this);
   }