fix(module:button): fix loading input only work first init. (#161)

NG-ZORRO · Dec 12, 2018 · b54bd04 · b54bd04 · Guoyuanqiang · Dec 12, 2018
1 parent 98fda4a
commit b54bd04
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 10 deletions.
diff --git a/components/button/button.component.spec.ts b/components/button/button.component.spec.ts
@@ -69,31 +69,40 @@ describe('button', () => {
       expect(buttons[14].nativeElement.classList.contains('am-button-disabled')).toBe(true);
     });
 
-    it ('shoulg touchstart work', () => {
+    it ('should touchstart work', () => {
       dispatchTouchEvent(buttons[0].nativeElement, 'touchstart');
       fixture.detectChanges();
     });
 
-    it ('shoulg mousedown work', () => {
+    it ('should mousedown work', () => {
       dispatchTouchEvent(buttons[0].nativeElement, 'mousedown');
       fixture.detectChanges();
     });
 
-    it ('shoulg touchend work', () => {
+    it ('should touchend work', () => {
       dispatchTouchEvent(buttons[0].nativeElement, 'touchend');
       fixture.detectChanges();
       dispatchTouchEvent(buttons[0].nativeElement, 'mouseup');
       fixture.detectChanges();
     });
 
-    it ('shoulg touchstart disable work', () => {
+    it ('should touchstart disable work', () => {
       dispatchTouchEvent(buttons[1].nativeElement, 'touchstart');
       fixture.detectChanges();
       dispatchTouchEvent(buttons[1].nativeElement, 'mousedown');
       fixture.detectChanges();
     });
 
-    it ('shoulg touchend disable work', () => {
+    it ('should loading work', () => {
+      dispatchTouchEvent(buttons[6].nativeElement, 'touchstart');
+      component.loading = false;
+      fixture.detectChanges();
+      expect(buttons[6].nativeElement.classList.contains('am-button-loading')).toBe(false);
+      dispatchTouchEvent(buttons[6].nativeElement, 'mousedown');
+      fixture.detectChanges();
+    });
+
+    it ('should touchend disable work', () => {
       dispatchTouchEvent(buttons[1].nativeElement, 'touchend');
       fixture.detectChanges();
       dispatchTouchEvent(buttons[1].nativeElement, 'mouseup');
@@ -118,7 +127,7 @@ describe('button', () => {
   <WhiteSpace ></WhiteSpace>
   <div Button [type]="'warning'" [disabled]="true">warning</div>
   <WhiteSpace ></WhiteSpace>
-  <div Button [loading]="true" >loading</div>
+  <div Button [loading]="loading" >loading</div>
   <WhiteSpace ></WhiteSpace>
   <div Button [icon]="'check-circle-o'">with icon</div>
   <WhiteSpace ></WhiteSpace>
@@ -164,6 +173,7 @@ export class TestButton implements OnInit, OnDestroy {
   size = 'small';
   inline = true;
   disabled = true;
+  loading = true;
   closeTimer;
 
   constructor() {}

diff --git a/components/button/button.component.ts b/components/button/button.component.ts
@@ -130,10 +130,9 @@ export class Button implements AfterViewInit {
 
   set loading(value: boolean) {
     this._loading = value;
-    if (value) {
-      if (this._el.querySelector('icon')) {
-        this._el.querySelector('icon').parentNode.removeChild(this._el.querySelector('icon'));
-      }
+    if (this._el.querySelector('icon')) {
+      const icon =  this._el.querySelector('icon') as HTMLElement;
+      icon.style.display = value ? '' : 'none';
     }
     this.setClassMap();
   }