Skip to content
Permalink
Browse files

feat(module:progress): support nzTooltipPlacement (#4007)

refactor(module:progress): not use deprecated API internally
  • Loading branch information...
wendzhue authored and hsuanxyz committed Sep 9, 2019
1 parent 272dc98 commit d6a29686f46296107a292df888fa25d2ff6b0aac
@@ -46,6 +46,13 @@ export class NzPopconfirmDirective extends NzTooltipBaseDirective implements OnI
@Input() nzCancelText: string;
@Input() nzIcon: string | TemplateRef<void>;
@Input() @InputBoolean() nzCondition: boolean;

/**
* @deprecated 9.0.0. This is deprecated and going to be removed in 9.0.0.
* Please use a more specific API. Like `nzTooltipTrigger`.
*/
@Input() nzTrigger: NzTooltipTrigger = 'click';

@Output() readonly nzOnCancel = new EventEmitter<void>();
@Output() readonly nzOnConfirm = new EventEmitter<void>();

@@ -36,5 +36,6 @@ import { NzSliderModule } from 'ng-zorro-antd/slider';
| `[ngModel]` | The value of slider. When `range` is `false`, use `number`, otherwise, use `[number, number]` | `number \| number[]` | - |
| `[nzVertical]` | If true, the slider will be vertical. | `boolean` | `false` |
| `[nzTooltipVisible]` | When set to `always` tooltips are always displayed. When set to `never` they are never displayed | `'default' \| 'always' \| 'never'` | `default` |
| `[nzTooltipPlacement]` | Set the default placement of Tooltip | `string` | |
| `(nzOnAfterChange)` | Fire when `onmouseup` is fired. | `EventEmitter<number[] \| number>` | - |
| `(ngModelChange)` | Callback function that is fired when the user changes the slider's value. | `EventEmitter<number[] \| number>` | - |
@@ -37,5 +37,6 @@ import { NzSliderModule } from 'ng-zorro-antd/slider';
| `[ngModel]` | 设置当前取值。当 `range` 为 `false` 时,使用 `number`,否则用 `[number, number]` | `number \| number[]` | - |
| `[nzVertical]` | 值为 `true` 时,Slider 为垂直方向 | `boolean` | `false` |
| `[nzTooltipVisible]` | 值为 `always` 时总是显示,值为 `never` 时在任何情况下都不显示 | `'default' \| 'always' \| 'never'` | `default` |
| `[nzTooltipPlacement]` | 设置 Tooltip 的默认位置。 | `string` | |
| `(nzOnAfterChange)` | 与 `onmouseup` 触发时机一致,把当前值作为参数传入。 | `EventEmitter<number[] \| number>` | - |
| `(ngModelChange)` | 当 Slider 的值发生改变时,会触发 ngModelChange 事件,并把改变后的值作为参数传入。 | `EventEmitter<number[] \| number>>` | - |
@@ -1,8 +1,10 @@
<nz-tooltip
*ngIf="nzTipFormatter !== null && nzTooltipVisible !== 'never'"
[nzTitle]="tooltipTitle"
[nzTrigger]="null">
<!--TODO(wendzhue): [IVY] nz-tooltip[ngStyle] not work in ivy-->
<div nz-tooltip class="ant-slider-handle" [ngStyle]="style"></div>
</nz-tooltip>
<div *ngIf="nzTipFormatter === null || nzTooltipVisible === 'never'" class="ant-slider-handle" [ngStyle]="style"></div>
<div nz-tooltip
*ngIf="nzTipFormatter !== null && nzTooltipVisible !== 'never'"
class="ant-slider-handle"
[ngStyle]="style"
[nzTitle]="tooltipTitle"
[nzTrigger]="null"
[nzPlacement]="nzTooltipPlacement"></div>
<div *ngIf="nzTipFormatter === null || nzTooltipVisible === 'never'"
class="ant-slider-handle"
[ngStyle]="style"></div>
@@ -20,7 +20,7 @@ import {
import { Subscription } from 'rxjs';

import { InputBoolean, NgStyleInterface } from 'ng-zorro-antd/core';
import { NzToolTipComponent } from 'ng-zorro-antd/tooltip';
import { NzTooltipDirective } from 'ng-zorro-antd/tooltip';

import { SliderShowTooltip } from './nz-slider-definitions';
import { NzSliderComponent } from './nz-slider.component';
@@ -38,12 +38,13 @@ import { NzSliderComponent } from './nz-slider.component';
}
})
export class NzSliderHandleComponent implements OnChanges, OnDestroy {
@ViewChild(NzToolTipComponent, { static: false }) tooltip: NzToolTipComponent;
@ViewChild(NzTooltipDirective, { static: false }) tooltip: NzTooltipDirective;

@Input() nzVertical: string;
@Input() nzOffset: number;
@Input() nzValue: number;
@Input() nzTooltipVisible: SliderShowTooltip = 'default';
@Input() nzTooltipPlacement: string;
@Input() nzTipFormatter: (value: number) => string;
@Input() @InputBoolean() nzActive = false;

@@ -23,8 +23,10 @@
[nzValue]="handle.value"
[nzActive]="handle.active"
[nzTipFormatter]="nzTipFormatter"
[nzTooltipVisible]="nzTooltipVisible"></nz-slider-handle>
<nz-slider-marks
[nzTooltipVisible]="nzTooltipVisible"
[nzTooltipPlacement]="nzTooltipPlacement"
></nz-slider-handle>
<nz-slider-marks
*ngIf="marksArray"
[nzVertical]="nzVertical"
[nzMin]="nzMin"
@@ -78,6 +78,7 @@ export class NzSliderComponent implements ControlValueAccessor, OnInit, OnChange
@Input() nzMin = 0;
@Input() nzStep = 1;
@Input() nzTooltipVisible: SliderShowTooltip = 'default';
@Input() nzTooltipPlacement: string = 'top';
@Input() nzTipFormatter: (value: number) => string;

@Output() readonly nzOnAfterChange = new EventEmitter<SliderValue>();
@@ -54,13 +54,13 @@ export abstract class NzTooltipBaseDirective implements OnChanges, OnInit, OnDes
* @deprecated 9.0.0. This is deprecated and going to be removed in 9.0.0.
* Please use a more specific API. Like `nzTooltipTrigger`.
*/
@Input() nzTrigger: NzTooltipTrigger;
@Input() nzTrigger: NzTooltipTrigger = 'hover';

/**
* @deprecated 9.0.0. This is deprecated and going to be removed in 9.0.0.
* Please use a more specific API. Like `nzTooltipPlacement`.
*/
@Input() nzPlacement: string;
@Input() nzPlacement: string = 'top';

@Input() nzMouseEnterDelay: number;
@Input() nzMouseLeaveDelay: number;
@@ -227,13 +227,14 @@ export abstract class NzTooltipBaseDirective implements OnChanges, OnInit, OnDes
this.updateChangedProperties(this.needProxyProperties);
}

// TODO: support changing trigger.
protected registerTriggers(): void {
// When the method gets invoked, all properties has been synced to the dynamic component.
// After removing the old API, we can just check the directive's own `nzTrigger`.
const el = this.elementRef.nativeElement;

if (this.tooltip.nzTrigger === 'hover') {
const trigger = this.isDynamicTooltip ? this.trigger : this.tooltip.nzTrigger;

if (trigger === 'hover') {
let overlayElement: HTMLElement;
this.triggerUnlisteners.push(
this.renderer.listen(el, 'mouseenter', () => {
@@ -258,10 +259,10 @@ export abstract class NzTooltipBaseDirective implements OnChanges, OnInit, OnDes
}
})
);
} else if (this.tooltip.nzTrigger === 'focus') {
} else if (trigger === 'focus') {
this.triggerUnlisteners.push(this.renderer.listen(el, 'focus', () => this.show()));
this.triggerUnlisteners.push(this.renderer.listen(el, 'blur', () => this.hide()));
} else if (this.tooltip.nzTrigger === 'click') {
} else if (trigger === 'click') {
this.triggerUnlisteners.push(
this.renderer.listen(el, 'click', e => {
e.preventDefault();

0 comments on commit d6a2968

Please sign in to comment.
You can’t perform that action at this time.