Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: ng-zorro-antd 8.0.0 & sync antd 3.19 #3580

Merged
merged 11 commits into from
Jun 21, 2019
14 changes: 7 additions & 7 deletions components/affix/nz-affix.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@ import {
shallowEqual,
throttleByAnimationFrameDecorator,
toNumber,
NzScrollService,
NGStyleInterface
NgStyleInterface,
NzScrollService
} from 'ng-zorro-antd/core';

@Component({
Expand Down Expand Up @@ -84,8 +84,8 @@ export class NzAffixComponent implements OnInit, OnDestroy {

private readonly placeholderNode: HTMLElement;

private affixStyle: NGStyleInterface | undefined;
private placeholderStyle: NGStyleInterface | undefined;
private affixStyle: NgStyleInterface | undefined;
private placeholderStyle: NgStyleInterface | undefined;
private _target: Element | Window | null = null;
private _offsetTop: number | null;
private _offsetBottom: number | null;
Expand Down Expand Up @@ -167,7 +167,7 @@ export class NzAffixComponent implements OnInit, OnDestroy {
: ({ top: 0, left: 0, bottom: 0 } as ClientRect);
}

private genStyle(affixStyle?: NGStyleInterface): string {
private genStyle(affixStyle?: NgStyleInterface): string {
if (!affixStyle) {
return '';
}
Expand All @@ -179,7 +179,7 @@ export class NzAffixComponent implements OnInit, OnDestroy {
.join(';');
}

private setAffixStyle(e: Event, affixStyle?: NGStyleInterface): void {
private setAffixStyle(e: Event, affixStyle?: NgStyleInterface): void {
const originalAffixStyle = this.affixStyle;
const isWindow = this._target === window;
if (e.type === 'scroll' && originalAffixStyle && affixStyle && isWindow) {
Expand All @@ -205,7 +205,7 @@ export class NzAffixComponent implements OnInit, OnDestroy {
}
}

private setPlaceholderStyle(placeholderStyle?: NGStyleInterface): void {
private setPlaceholderStyle(placeholderStyle?: NgStyleInterface): void {
const originalPlaceholderStyle = this.placeholderStyle;
if (shallowEqual(placeholderStyle, originalPlaceholderStyle)) {
return;
Expand Down
2 changes: 1 addition & 1 deletion components/alert/doc/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ import { NzAlertModule } from 'ng-zorro-antd';
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| `[nzBanner]` | Whether to show as banner | `boolean` | `false` |
| `[nzClosable]` | Whether Alert can be closed | `boolean` | - |
| `[nzCloseable]` | Whether Alert can be closed | `boolean` | - |
| `[nzCloseText]` | Close text to show | `string|TemplateRef<void>` | - |
| `[nzDescription]` | Additional content of Alert | `string|TemplateRef<void>` | - |
| `[nzMessage]` | Content of Alert | `string|TemplateRef<void>` | - |
Expand Down
2 changes: 1 addition & 1 deletion components/alert/doc/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ import { NzAlertModule } from 'ng-zorro-antd';
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| `[nzBanner]` | 是否用作顶部公告 | `boolean` | `false` |
| `[nzClosable]` | 默认不显示关闭按钮 | `boolean` | - |
| `[nzCloseable]` | 默认不显示关闭按钮 | `boolean` | - |
| `[nzCloseText]` | 自定义关闭按钮 | `string|TemplateRef<void>` | - |
| `[nzDescription]` | 警告提示的辅助性文字介绍 | `string|TemplateRef<void>` | - |
| `[nzMessage]` | 警告提示内容 | `string|TemplateRef<void>` | - |
Expand Down
2 changes: 1 addition & 1 deletion components/alert/nz-alert.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
<ng-container *ngIf="nzShowIcon">
<i class="ant-alert-icon" [ngClass]="nzIconType" *ngIf="nzIconType; else iconTemplate"></i>
<ng-template #iconTemplate>
<i nz-icon class="ant-alert-icon" [type]="iconType" [theme]="iconTheme"></i>
<i nz-icon class="ant-alert-icon" [type]="iconType" [nzTheme]="iconTheme"></i>
</ng-template>
</ng-container>
<span class="ant-alert-message" *ngIf="nzMessage">
Expand Down
4 changes: 2 additions & 2 deletions components/anchor/nz-anchor.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ import {
import { fromEvent, Subscription } from 'rxjs';
import { distinctUntilChanged, throttleTime } from 'rxjs/operators';

import { toNumber, InputBoolean, InputNumber, NzScrollService, NGStyleInterface } from 'ng-zorro-antd/core';
import { toNumber, InputBoolean, InputNumber, NgStyleInterface, NzScrollService } from 'ng-zorro-antd/core';

import { NzAnchorLinkComponent } from './nz-anchor-link.component';

Expand Down Expand Up @@ -75,7 +75,7 @@ export class NzAnchorComponent implements OnDestroy, AfterViewInit {
@Output() readonly nzScroll = new EventEmitter<NzAnchorLinkComponent>();

visible = false;
wrapperStyle: NGStyleInterface = { 'max-height': '100vh' };
wrapperStyle: NgStyleInterface = { 'max-height': '100vh' };

private links: NzAnchorLinkComponent[] = [];
private animating = false;
Expand Down
4 changes: 2 additions & 2 deletions components/badge/nz-badge.component.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<span (cdkObserveContent)="checkContent()" #contentElement><ng-content></ng-content></span>
<span #contentElement><ng-content></ng-content></span>
<span class="ant-badge-status-dot ant-badge-status-{{nzStatus || presetColor}}"
[style.background]="!presetColor && nzColor"
*ngIf="nzStatus || nzColor"
Expand All @@ -16,7 +16,7 @@
<span class="ant-scroll-number-only"
*ngIf="count <= nzOverflowCount"
[style.transform]="'translateY(' + (-countArray[i] * 100) + '%)'">
<ng-container *ngIf="(!nzDot)&&(countArray[i]!=null)">
<ng-container *ngIf="!nzDot && countArray[i] !== undefined">
<p *ngFor="let p of countSingleArray" [class.current]="p === countArray[i]">{{ p }}</p>
</ng-container>
</span>
Expand Down
24 changes: 21 additions & 3 deletions components/badge/nz-badge.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,15 @@
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/

import { ContentObserver } from '@angular/cdk/observers';
import {
AfterViewInit,
ChangeDetectionStrategy,
Component,
ElementRef,
Input,
OnChanges,
OnDestroy,
OnInit,
Renderer2,
SimpleChanges,
Expand All @@ -21,6 +23,8 @@ import {
ViewEncapsulation
} from '@angular/core';
import { isEmpty, zoomBadgeMotion, InputBoolean } from 'ng-zorro-antd/core';
import { Subject } from 'rxjs';
import { startWith, takeUntil } from 'rxjs/operators';

export type NzBadgeStatusType = 'success' | 'processing' | 'default' | 'error' | 'warning';

Expand All @@ -36,7 +40,8 @@ export type NzBadgeStatusType = 'success' | 'processing' | 'default' | 'error' |
'[class.ant-badge-status]': 'nzStatus'
}
})
export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
private destroy$ = new Subject();
maxNumberArray: string[] = [];
countArray: number[] = [];
countSingleArray = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
Expand Down Expand Up @@ -84,7 +89,7 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
this.maxNumberArray = this.nzOverflowCount.toString().split('');
}

constructor(private renderer: Renderer2, private elementRef: ElementRef) {
constructor(private renderer: Renderer2, private elementRef: ElementRef, private contentObserver: ContentObserver) {
renderer.addClass(elementRef.nativeElement, 'ant-badge');
}

Expand All @@ -93,7 +98,15 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
}

ngAfterViewInit(): void {
this.checkContent();
this.contentObserver
.observe(this.contentElement)
.pipe(
startWith(true),
takeUntil(this.destroy$)
)
.subscribe(() => {
this.checkContent();
});
}

ngOnChanges(changes: SimpleChanges): void {
Expand All @@ -112,4 +125,9 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
this.presetColor = this.colorArray.indexOf(this.nzColor) !== -1 ? this.nzColor : null;
}
}

ngOnDestroy(): void {
this.destroy$.next();
this.destroy$.complete();
}
}
5 changes: 2 additions & 3 deletions components/badge/nz-badge.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testin
import { By } from '@angular/platform-browser';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';

import { NGStyleInterface } from 'ng-zorro-antd/core';
import { NgStyleInterface } from 'ng-zorro-antd/core';

import { NzBadgeComponent } from './nz-badge.component';
import { NzBadgeModule } from './nz-badge.module';
Expand Down Expand Up @@ -121,7 +121,6 @@ describe('badge', () => {
});

@Component({
selector: 'nz-test-badge-basic',
template: `
<nz-badge
[nzCount]="count"
Expand All @@ -143,6 +142,6 @@ export class NzTestBadgeBasicComponent {
overflow = 20;
showZero = false;
status: string;
style: NGStyleInterface;
style: NgStyleInterface;
text: string;
}
6 changes: 3 additions & 3 deletions components/button/demo/multiple.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ import { Component } from '@angular/core';
template: `
<button nz-button nzType="primary">primary</button>
<button nz-button nzType="default">secondary</button>
<nz-dropdown>
<button nz-button nz-dropdown>Actions<i nz-icon type="down"></i></button>
<button nz-button nz-dropdown [nzDropdownMenu]="menu">Actions<i nz-icon type="down"></i></button>
<nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu>
<li nz-menu-item>
<a>1st item</a>
Expand All @@ -18,7 +18,7 @@ import { Component } from '@angular/core';
<a>3rd item</a>
</li>
</ul>
</nz-dropdown>
</nz-dropdown-menu>
`,
styles: [
`
Expand Down
13 changes: 6 additions & 7 deletions components/button/nz-button-group.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
*/

import { ChangeDetectionStrategy, Component, ElementRef, Input, OnInit, ViewEncapsulation } from '@angular/core';

import { NzSizeLDSType, NzUpdateHostClassService } from 'ng-zorro-antd/core';

@Component({
Expand All @@ -20,6 +19,8 @@ import { NzSizeLDSType, NzUpdateHostClassService } from 'ng-zorro-antd/core';
templateUrl: './nz-button-group.component.html'
})
export class NzButtonGroupComponent implements OnInit {
private _size: NzSizeLDSType;

@Input()
get nzSize(): NzSizeLDSType {
return this._size;
Expand All @@ -32,14 +33,12 @@ export class NzButtonGroupComponent implements OnInit {

constructor(private nzUpdateHostClassService: NzUpdateHostClassService, private elementRef: ElementRef) {}

private _size: NzSizeLDSType;
private prefixCls = 'ant-btn-group';

setClassMap(): void {
const prefixCls = 'ant-btn-group';
const classMap = {
[this.prefixCls]: true,
[`${this.prefixCls}-lg`]: this.nzSize === 'large',
[`${this.prefixCls}-sm`]: this.nzSize === 'small'
[prefixCls]: true,
[`${prefixCls}-lg`]: this.nzSize === 'large',
[`${prefixCls}-sm`]: this.nzSize === 'small'
};
this.nzUpdateHostClassService.updateHostClass(this.elementRef.nativeElement, classMap);
}
Expand Down
90 changes: 77 additions & 13 deletions components/core/addon/string_template_outlet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,50 +6,114 @@
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/

import { Directive, EmbeddedViewRef, Input, TemplateRef, ViewContainerRef } from '@angular/core';
import {
Directive,
EmbeddedViewRef,
Input,
OnChanges,
SimpleChange,
SimpleChanges,
TemplateRef,
ViewContainerRef
} from '@angular/core';

@Directive({
selector: '[nzStringTemplateOutlet]',
exportAs: 'nzStringTemplateOutlet'
})
export class NzStringTemplateOutletDirective {
export class NzStringTemplateOutletDirective implements OnChanges {
private isTemplate: boolean;
private inputTemplate: TemplateRef<void> | null = null;
// tslint:disable-next-line:no-any
private inputTemplate: TemplateRef<any> | null = null;
private inputViewRef: EmbeddedViewRef<void> | null = null;
private defaultViewRef: EmbeddedViewRef<void> | null = null;

constructor(private viewContainer: ViewContainerRef, private defaultTemplate: TemplateRef<void>) {}
// tslint:disable-next-line:no-any
@Input() nzStringTemplateOutletContext: any | null = null;

@Input()
set nzStringTemplateOutlet(value: string | TemplateRef<void>) {
// tslint:disable-next-line:no-any
set nzStringTemplateOutlet(value: string | TemplateRef<any>) {
if (value instanceof TemplateRef) {
this.isTemplate = true;
this.inputTemplate = value;
} else {
this.isTemplate = false;
}
this.updateView();
}

updateView(): void {
recreateView(): void {
if (!this.isTemplate) {
/** use default template when input is string **/
if (!this.defaultViewRef) {
this.viewContainer.clear();
this.inputViewRef = null;
if (this.defaultTemplate) {
this.defaultViewRef = this.viewContainer.createEmbeddedView(this.defaultTemplate);
this.defaultViewRef = this.viewContainer.createEmbeddedView(
this.defaultTemplate,
this.nzStringTemplateOutletContext
);
}
}
} else {
/** use input template when input is templateRef **/
if (!this.inputViewRef) {
this.viewContainer.clear();
this.defaultViewRef = null;
if (this.inputTemplate) {
this.inputViewRef = this.viewContainer.createEmbeddedView(this.inputTemplate);
this.inputViewRef = this.viewContainer.createEmbeddedView(
this.inputTemplate,
this.nzStringTemplateOutletContext
);
}
}
}
}

private shouldRecreateView(changes: SimpleChanges): boolean {
const { nzStringTemplateOutletContext, nzStringTemplateOutlet } = changes;
return (
!!nzStringTemplateOutlet ||
(nzStringTemplateOutletContext && this.hasContextShapeChanged(nzStringTemplateOutletContext))
);
}

private hasContextShapeChanged(ctxChange: SimpleChange): boolean {
const prevCtxKeys = Object.keys(ctxChange.previousValue || {});
const currCtxKeys = Object.keys(ctxChange.currentValue || {});

if (prevCtxKeys.length === currCtxKeys.length) {
for (const propName of currCtxKeys) {
if (prevCtxKeys.indexOf(propName) === -1) {
return true;
}
}
return false;
} else {
return true;
}
}

// tslint:disable-next-line:no-any
private updateExistingContext(ctx: any): void {
for (const propName of Object.keys(ctx)) {
// tslint:disable-next-line:no-any
(this.inputViewRef!.context as any)[propName] = this.nzStringTemplateOutletContext[propName];
}
}

constructor(private viewContainer: ViewContainerRef, private defaultTemplate: TemplateRef<void>) {}

ngOnChanges(changes: SimpleChanges): void {
const recreateView = this.shouldRecreateView(changes);

if (recreateView) {
if (this.viewContainer) {
this.viewContainer.clear();
this.defaultViewRef = null;
this.inputViewRef = null;
}
this.recreateView();
} else {
if (this.inputViewRef && this.nzStringTemplateOutletContext) {
this.updateExistingContext(this.nzStringTemplateOutletContext);
}
}
}
}
2 changes: 1 addition & 1 deletion components/core/dropdown/nz-dropdown-service.resolver.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,4 @@ import { InjectionToken } from '@angular/core';

import { NzMenuBaseService } from './nz-menu-base.service';

export const NzDropdownHigherOrderServiceToken = new InjectionToken<NzMenuBaseService>('NzTreeHigherOrder');
export const NzDropdownHigherOrderServiceToken = new InjectionToken<NzMenuBaseService>('NzMenuHigherOrder');
Loading