diff --git a/components/empty/nz-embed-empty.component.ts b/components/empty/nz-embed-empty.component.ts index 4aeed43c1f6..9ca58dd8e7d 100644 --- a/components/empty/nz-embed-empty.component.ts +++ b/components/empty/nz-embed-empty.component.ts @@ -23,11 +23,29 @@ import { ViewEncapsulation } from '@angular/core'; import { DomSanitizer } from '@angular/platform-browser'; -import { Subscription } from 'rxjs'; +import { Subject } from 'rxjs'; +import { takeUntil } from 'rxjs/operators'; import { NZ_EMPTY_COMPONENT_NAME, NzEmptyCustomContent, NzEmptySize, simpleEmptyImage } from './nz-empty-config'; import { NzEmptyService } from './nz-empty.service'; +function getEmptySize(componentName: string): NzEmptySize { + switch (componentName) { + case 'table': + case 'list': + return 'normal'; + case 'select': + case 'tree-select': + case 'cascader': + case 'transfer': + return 'small'; + default: + return ''; + } +} + +type NzEmptyContentType = 'component' | 'template' | 'string'; + @Component({ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, @@ -40,11 +58,12 @@ export class NzEmbedEmptyComponent implements OnChanges, OnInit, OnDestroy { @Input() specificContent: NzEmptyCustomContent; content?: NzEmptyCustomContent; - contentType: 'component' | 'template' | 'string' = 'string'; + contentType: NzEmptyContentType = 'string'; contentPortal?: Portal; // tslint:disable-line:no-any defaultSvg = this.sanitizer.bypassSecurityTrustResourceUrl(simpleEmptyImage); size: NzEmptySize = ''; - subs_ = new Subscription(); + + private $destroy = new Subject(); constructor( public emptyService: NzEmptyService, @@ -56,7 +75,7 @@ export class NzEmbedEmptyComponent implements OnChanges, OnInit, OnDestroy { ngOnChanges(changes: SimpleChanges): void { if (changes.nzComponentName) { - this.size = this.getEmptySize(changes.nzComponentName.currentValue); + this.size = getEmptySize(changes.nzComponentName.currentValue); } if (changes.specificContent && !changes.specificContent.isFirstChange()) { @@ -66,31 +85,15 @@ export class NzEmbedEmptyComponent implements OnChanges, OnInit, OnDestroy { } ngOnInit(): void { - const userContent_ = this.emptyService.userDefaultContent$.subscribe(content => { + this.emptyService.userDefaultContent$.pipe(takeUntil(this.$destroy)).subscribe(content => { this.content = this.specificContent || content; this.renderEmpty(); }); - - this.subs_.add(userContent_); } ngOnDestroy(): void { - this.subs_.unsubscribe(); - } - - private getEmptySize(componentName: string): NzEmptySize { - switch (componentName) { - case 'table': - case 'list': - return 'normal'; - case 'select': - case 'tree-select': - case 'cascader': - case 'transfer': - return 'small'; - default: - return ''; - } + this.$destroy.next(); + this.$destroy.complete(); } private renderEmpty(): void { diff --git a/components/empty/nz-empty.service.ts b/components/empty/nz-empty.service.ts index c028f9fbe2f..07232b41f5d 100644 --- a/components/empty/nz-empty.service.ts +++ b/components/empty/nz-empty.service.ts @@ -6,41 +6,33 @@ * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE */ -import { Inject, Injectable, Optional, TemplateRef, Type } from '@angular/core'; +import { Injectable, TemplateRef, Type } from '@angular/core'; import { BehaviorSubject } from 'rxjs'; +import { startWith } from 'rxjs/operators'; -import { NzConfigService, PREFIX, warnDeprecation } from 'ng-zorro-antd/core'; +import { NzConfigService, PREFIX } from 'ng-zorro-antd/core'; -import { NZ_DEFAULT_EMPTY_CONTENT, NzEmptyCustomContent } from './nz-empty-config'; +import { NzEmptyCustomContent } from './nz-empty-config'; @Injectable({ providedIn: 'root' }) -// tslint:disable-next-line:no-any -export class NzEmptyService { +export class NzEmptyService { userDefaultContent$ = new BehaviorSubject(undefined); - constructor( - private nzConfigService: NzConfigService, - @Inject(NZ_DEFAULT_EMPTY_CONTENT) @Optional() private legacyDefaultEmptyContent: Type - ) { - if (legacyDefaultEmptyContent) { - warnDeprecation(`'NZ_DEFAULT_EMPTY_CONTENT' is deprecated and would be removed in 9.0.0. Please migrate to 'NZ_CONFIG'.`); - } - - const userDefaultEmptyContent = this.getUserDefaultEmptyContent(); - - if (userDefaultEmptyContent) { - this.userDefaultContent$.next(userDefaultEmptyContent); - } + constructor(public nzConfigService: NzConfigService) { + this.subscribeDefaultEmptyContentChange(); + } - this.nzConfigService.getConfigChangeEventForComponent('empty').subscribe(() => { + private subscribeDefaultEmptyContentChange(): void { + this.nzConfigService.getConfigChangeEventForComponent('empty').pipe(startWith(true)).subscribe(() => { this.userDefaultContent$.next(this.getUserDefaultEmptyContent()); }); } - setDefaultContent(content?: NzEmptyCustomContent): void { - warnDeprecation(`'setDefaultContent' is deprecated and would be removed in 9.0.0. Please migrate to 'NzConfigService'.`); + // tslint:disable-next-line:no-any + private getUserDefaultEmptyContent(): Type | TemplateRef | string | undefined { + const content = (this.nzConfigService.getConfigForComponent('empty') || {}).nzDefaultEmptyContent; if ( typeof content === 'string' || @@ -49,20 +41,11 @@ export class NzEmptyService { content instanceof TemplateRef || content instanceof Type ) { - this.userDefaultContent$.next(content); + return content; } else { - throw new Error(`${PREFIX} 'useDefaultContent' expect 'string', 'templateRef' or 'component' but get ${content}.`); + throw new Error( + `${PREFIX} default empty content expects a 'null', 'undefined', 'string', 'TemplateRef' or 'Component' but get ${content}.` + ); } } - - resetDefault(): void { - warnDeprecation( - `'resetDefault' is deprecated and would be removed in 9.0.0. Please migrate to 'NzConfigService' and provide an 'undefined'.` - ); - this.userDefaultContent$.next(undefined); - } - - private getUserDefaultEmptyContent(): Type | TemplateRef | string { - return (this.nzConfigService.getConfigForComponent('empty') || {}).nzDefaultEmptyContent || this.legacyDefaultEmptyContent; - } } diff --git a/components/empty/nz-empty.spec.ts b/components/empty/nz-empty.spec.ts index 93c6de2dd06..b71952d2a9a 100644 --- a/components/empty/nz-empty.spec.ts +++ b/components/empty/nz-empty.spec.ts @@ -2,18 +2,19 @@ import { CommonModule } from '@angular/common'; import { Component, DebugElement, Inject, NgModule, TemplateRef, ViewChild } from '@angular/core'; import { ComponentFixture, fakeAsync, TestBed, TestBedStatic, tick } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; +import { NZ_CONFIG } from 'ng-zorro-antd'; import { NzI18nService } from '../i18n'; import en_US from '../i18n/languages/en_US'; import { NzListModule } from '../list'; import { NzEmbedEmptyComponent } from './nz-embed-empty.component'; -import { NZ_DEFAULT_EMPTY_CONTENT, NZ_EMPTY_COMPONENT_NAME } from './nz-empty-config'; +import { NZ_EMPTY_COMPONENT_NAME } from './nz-empty-config'; import { NzEmptyComponent } from './nz-empty.component'; import { NzEmptyModule } from './nz-empty.module'; import { NzEmptyService } from './nz-empty.service'; -describe('nz-empty', () => { +describe('NzEmpty', () => { describe('basic', () => { let testBed: TestBedStatic; let fixture: ComponentFixture; @@ -182,7 +183,7 @@ describe('nz-empty', () => { it('should raise error when set a invalid default value', () => { expect(() => { // tslint:disable-next-line:no-any - testComponent.emptyService.setDefaultContent(false as any); + testComponent.emptyService.nzConfigService.set('empty', { nzDefaultEmptyContent: false as any }); fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -200,7 +201,7 @@ describe('nz-empty', () => { }; // String. - testComponent.emptyService.setDefaultContent('empty'); + testComponent.emptyService.nzConfigService.set('empty', { nzDefaultEmptyContent: 'empty' }); refresh(); expect(embedComponent).toBeTruthy(); expect(emptyComponent).toBeFalsy(); @@ -241,16 +242,6 @@ describe('nz-empty', () => { expect(imageEl.firstElementChild.getAttribute('alt')).toBe('empty'); expect(imageEl.firstElementChild.src).toContain('data:image/svg+xml'); })); - - it('should raise error when set a invalid default value', () => { - expect(() => { - // tslint:disable-next-line:no-any - testComponent.emptyService.setDefaultContent(false as any); - fixture.detectChanges(); - tick(); - fixture.detectChanges(); - }).toThrowError(); - }); }); /** @@ -318,18 +309,18 @@ export class NzEmptyTestBasicComponent { ` }) export class NzEmptyTestServiceComponent { - @ViewChild('tpl', { static: false }) template: TemplateRef; + @ViewChild('tpl', { static: false }) template: TemplateRef; noResult?: string | null; constructor(public emptyService: NzEmptyService) {} reset(): void { - this.emptyService.resetDefault(); + this.emptyService.nzConfigService.set('empty', { nzDefaultEmptyContent: undefined }); } changeToTemplate(): void { - this.emptyService.setDefaultContent(this.template); + this.emptyService.nzConfigService.set('empty', { nzDefaultEmptyContent: this.template }); } } @@ -359,8 +350,12 @@ export class NzEmptyTestServiceModule {} exports: [NzEmptyTestServiceComponent, NzEmptyTestCustomComponent], providers: [ { - provide: NZ_DEFAULT_EMPTY_CONTENT, - useValue: NzEmptyTestCustomComponent + provide: NZ_CONFIG, + useValue: { + empty: { + nzDefaultEmptyContent: NzEmptyTestCustomComponent + } + } } ] })