fix(module:icon): fix icon classname writeback (NG-ZORRO#2259)

wzhudev · Oct 15, 2018 · 52173dd · 52173dd
1 parent ee95fa3
commit 52173dd
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 17 deletions.
diff --git a/components/icon/nz-icon.directive.ts b/components/icon/nz-icon.directive.ts
@@ -74,12 +74,12 @@ export class NzIconDirective extends IconDirective implements OnInit, OnChanges,
     if (this.type !== anticonType) {
       this.type = anticonType;
       this._changeIcon()
-      .then(svg => {
-        this._addExtraModifications(svg);
-      })
-      .catch(err => {
-        console.warn('[NG-ZORRO]', `You can find more about this error on http://ng.ant.design/components/icon/en\n`, err);
-      });
+        .then(svg => {
+          this._addExtraModifications(svg);
+        })
+        .catch(err => {
+          console.warn('[NG-ZORRO]', `You can find more about this error on http://ng.ant.design/components/icon/en\n`, err);
+        });
     }
   }
 
@@ -100,13 +100,7 @@ export class NzIconDirective extends IconDirective implements OnInit, OnChanges,
 
   private _getIconNameBack(): void {
     if (typeof this.type === 'string') {
-      let back = '';
-      if (this.theme && this.theme !== 'outline' && !this.type.endsWith('-o')) {
-        back = `anticon-${withSuffix(this.type, this.theme)}`;
-      } else {
-        back = `anticon-${this.type}`;
-      }
-      this._renderer.addClass(this._elementRef.nativeElement, back);
+      this._renderer.addClass(this._elementRef.nativeElement, `anticon-${this.type}`);
     }
   }
 
@@ -137,8 +131,8 @@ export class NzIconDirective extends IconDirective implements OnInit, OnChanges,
       this._classChangeHandler(this._el.className);
       this._classNameObserver = new MutationObserver((mutations: MutationRecord[]) => {
         mutations
-        .filter((mutation: MutationRecord) => mutation.attributeName === 'class')
-        .forEach((mutation: MutationRecord) => this._classChangeHandler((mutation.target as HTMLElement).className));
+          .filter((mutation: MutationRecord) => mutation.attributeName === 'class')
+          .forEach((mutation: MutationRecord) => this._classChangeHandler((mutation.target as HTMLElement).className));
       });
       this._classNameObserver.observe(this._elementRef.nativeElement, { attributes: true });
     }

diff --git a/components/icon/nz-icon.spec.ts b/components/icon/nz-icon.spec.ts
@@ -1,6 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { Component } from '@angular/core';
-import { async, fakeAsync, flush, tick, TestBed } from '@angular/core/testing';
+import { async, fakeAsync, tick, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { LoadingOutline, QuestionCircleOutline, QuestionOutline } from '@ant-design/icons-angular/icons';
 import { NzIconDirective } from './nz-icon.directive';
@@ -19,13 +19,19 @@ describe('icon', () => {
     }).compileComponents();
   });
 
-  describe('expansions', () => {
+  describe('extensions', () => {
     beforeEach(() => {
       fixture = TestBed.createComponent(NzTestIconComponent);
       testComponent = fixture.debugElement.componentInstance;
       icons = fixture.debugElement.queryAll(By.directive(NzIconDirective));
     });
 
+    it('should get icon class name back', fakeAsync(() => {
+      fixture.detectChanges();
+      expect(icons[ 0 ].nativeElement.classList.contains('anticon-question'));
+      expect(icons[ 1 ].nativeElement.classList.contains('anticon-loading'));
+    }));
+
     it('should support spin and cancel', fakeAsync(() => {
       fixture.detectChanges();
       tick(1000);