refactor(module:core): support provide wave config with DI (#2594)

NG-ZORRO · Dec 11, 2018 · dfba49f · dfba49f
1 parent fa9160c
commit dfba49f
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 10 deletions.
diff --git a/components/button/nz-button.component.ts b/components/button/nz-button.component.ts
@@ -6,10 +6,11 @@ import {
   ContentChildren,
   ElementRef,
   HostBinding,
+  Inject,
   Input,
   NgZone,
   OnDestroy,
-  OnInit,
+  OnInit, Optional,
   QueryList,
   Renderer2,
   ViewChild,
@@ -21,7 +22,7 @@ import { NzSizeLDSType } from '../core/types/size';
 import { isEmpty } from '../core/util/check';
 import { toBoolean } from '../core/util/convert';
 import { findFirstNotEmptyNode, findLastNotEmptyNode } from '../core/util/dom';
-import { NzWaveDirective } from '../core/wave/nz-wave.directive';
+import { NzWaveConfig, NzWaveDirective, NZ_WAVE_GLOBAL_CONFIG } from '../core/wave/nz-wave.directive';
 import { NzIconDirective } from '../icon/nz-icon.directive';
 
 export type NzButtonType = 'primary' | 'dashed' | 'danger';
@@ -39,7 +40,7 @@ export class NzButtonComponent implements AfterContentInit, OnInit, OnDestroy {
   readonly el: HTMLElement = this.elementRef.nativeElement;
   @ViewChild('contentElement') contentElement: ElementRef;
   @ContentChildren(NzIconDirective, { read: ElementRef }) listOfIconElement: QueryList<ElementRef>;
-  @HostBinding('attr.nz-wave') nzWave = new NzWaveDirective(this.ngZone, this.elementRef);
+  @HostBinding('attr.nz-wave') nzWave = new NzWaveDirective(this.ngZone, this.elementRef, this.waveConfig);
 
   @Input()
   set nzBlock(value: boolean) {
@@ -112,7 +113,9 @@ export class NzButtonComponent implements AfterContentInit, OnInit, OnDestroy {
     return this._loading;
   }
 
-  constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef, private renderer: Renderer2, private nzUpdateHostClassService: NzUpdateHostClassService, private ngZone: NgZone) {
+  constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef, private renderer: Renderer2,
+              private nzUpdateHostClassService: NzUpdateHostClassService, private ngZone: NgZone,
+              @Optional() @Inject(NZ_WAVE_GLOBAL_CONFIG) private waveConfig: NzWaveConfig) {
   }
 
   private _ghost = false;

diff --git a/components/core/wave/nz-wave-renderer.ts b/components/core/wave/nz-wave-renderer.ts
@@ -3,7 +3,7 @@ import { NgZone } from '@angular/core';
 
 export class NzWaveRenderer {
 
-  readonly waveTransitionDuration = 400;
+  private waveTransitionDuration = 400;
   private styleForPseudo: HTMLStyleElement | null;
   private extraNode: HTMLDivElement | null;
   private lastTime = 0;

diff --git a/components/core/wave/nz-wave.directive.ts b/components/core/wave/nz-wave.directive.ts
@@ -1,16 +1,48 @@
-import { Directive, ElementRef, Input, NgZone, OnDestroy, OnInit } from '@angular/core';
+import {
+  Directive,
+  ElementRef,
+  Inject,
+  InjectionToken,
+  Input,
+  NgZone,
+  OnDestroy,
+  OnInit,
+  Optional
+} from '@angular/core';
 import { NzWaveRenderer } from './nz-wave-renderer';
 
+export interface NzWaveConfig {
+  disabled?: boolean;
+}
+
+export const NZ_WAVE_GLOBAL_DEFAULT_CONFIG: NzWaveConfig = {
+  disabled: false
+};
+
+export const NZ_WAVE_GLOBAL_CONFIG = new InjectionToken<NzWaveConfig>('nz-wave-global-options', {
+  providedIn: 'root',
+  factory: NZ_WAVE_GLOBAL_CONFIG_FACTORY
+});
+
+export function NZ_WAVE_GLOBAL_CONFIG_FACTORY(): NzWaveConfig {
+  return NZ_WAVE_GLOBAL_DEFAULT_CONFIG;
+}
+
 @Directive({
   selector: '[nz-wave]'
 })
 export class NzWaveDirective implements OnInit, OnDestroy {
+  @Input() nzWaveExtraNode = false;
 
   private waveRenderer: NzWaveRenderer;
+  private waveDisabled: boolean = false;
 
-  @Input() nzWaveExtraNode = false;
-
-  constructor(private ngZone: NgZone, private elementRef: ElementRef) {
+  constructor(private ngZone: NgZone,
+              private elementRef: ElementRef,
+              @Optional() @Inject(NZ_WAVE_GLOBAL_CONFIG) config: NzWaveConfig) {
+    if (config && typeof config.disabled === 'boolean') {
+      this.waveDisabled = config.disabled;
+    }
   }
 
   ngOnDestroy(): void {
@@ -20,7 +52,11 @@ export class NzWaveDirective implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
-    if (this.elementRef.nativeElement) {
+    this.renderWaveIfEnabled();
+  }
+
+  renderWaveIfEnabled(): void {
+    if (!this.waveDisabled && this.elementRef.nativeElement) {
       this.waveRenderer = new NzWaveRenderer(this.elementRef.nativeElement, this.ngZone, this.nzWaveExtraNode);
     }
   }