From 47248b1e4041b38cc478527a754a3ef71fd311fc Mon Sep 17 00:00:00 2001
From: CaerusKaru <caerus.karu@gmail.com>
Date: Tue, 15 Jan 2019 08:18:41 -0600
Subject: [PATCH] fix(ngClass): should properly remove classes without fallback
 (#995)

In some cases where a fallback `ngClass` is not defined, the ClassDirective had no way of knowing to remove its ngClass on deactivation.

> Unlike other directives, the `removeStyles` action has no effect on ClassDirective.

By specifying an empty default fallback, we ensure that on deactivation - if no other default is specified - the ClassDirective will correctly fallback to an empty string case.


Fixes #992.
---
 src/lib/extended/class/class.spec.ts | 17 +++++++++++++++++
 src/lib/extended/class/class.ts      |  1 +
 2 files changed, 18 insertions(+)

diff --git a/src/lib/extended/class/class.spec.ts b/src/lib/extended/class/class.spec.ts
index 679c30251..b245df829 100644
--- a/src/lib/extended/class/class.spec.ts
+++ b/src/lib/extended/class/class.spec.ts
@@ -87,6 +87,23 @@ describe('class directive', () => {
       expectNativeEl(fixture).not.toHaveCssClass('class2');
     });
 
+  it('should use responsive ngClass string and remove without fallback', () => {
+    createTestComponent(`<div [ngClass.xs]="'what class2'"></div>`);
+
+    expectNativeEl(fixture).not.toHaveCssClass('what');
+    expectNativeEl(fixture).not.toHaveCssClass('class2');
+
+    // the CSS classes listed in the string (space delimited) are added,
+    // See https://angular.io/api/common/NgClass
+    mediaController.activate('xs');
+    expectNativeEl(fixture).toHaveCssClass('what');
+    expectNativeEl(fixture).toHaveCssClass('class2');
+
+    mediaController.activate('lg');
+    expectNativeEl(fixture).not.toHaveCssClass('what');
+    expectNativeEl(fixture).not.toHaveCssClass('class2');
+  });
+
   it('should override base `class` values with responsive ngClass map', () => {
       createTestComponent(`
         <div class="class0" [ngClass.xs]="{'what':true, 'class2':true, 'class0':false}"></div>
diff --git a/src/lib/extended/class/class.ts b/src/lib/extended/class/class.ts
index 1531daa43..ce31a55ba 100644
--- a/src/lib/extended/class/class.ts
+++ b/src/lib/extended/class/class.ts
@@ -49,6 +49,7 @@ export class ClassDirective extends BaseDirective2 implements DoCheck {
       );
     }
     this.init();
+    this.setValue('', '');
   }
 
   protected updateWithValue(value: any) {