Skip to content

Commit

Permalink
feat(module:input-number): support nzId
Browse files Browse the repository at this point in the history
  • Loading branch information
vthinkxie authored and vthinkxie committed Jun 22, 2019
1 parent f56027e commit a6500c8
Show file tree
Hide file tree
Showing 4 changed files with 29 additions and 21 deletions.
3 changes: 3 additions & 0 deletions components/input-number/doc/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ import { NzInputNumberModule } from 'ng-zorro-antd';

### nz-input-number

The value entered in `nz-input-number` will not be verified at the time of input, but will be fed back to `[ngModel]` and `(ngModelChange)` at a specific timing (Enter key, up and down keys, blur, etc.), otherwise input data such as `-0.12` or `1e10`, the `ngModel` will always be `undefined`.

| property | description | type | default |
| -------- | ----------- | ---- | ------- |
| `[ngModel]` | current value, double binding | `number|string``string` | - |
Expand All @@ -37,6 +39,7 @@ import { NzInputNumberModule } from 'ng-zorro-antd';
| `[nzSize]` | width of input box | `'large'|'small'|'default'` | `'default'` |
| `[nzStep]` | The number to which the current value is increased or decreased. It can be an integer or decimal. | `number|string` | `1` |
| `[nzPlaceHolder]` | Placeholder of select | `string` | - |
| `[nzId]` | input id attribute inside the component| `string` | - |
| `(ngModelChange)` | The callback triggered when the value is changed | `EventEmitter<number>` | - |
| `(nzFocus)` | focus callback | `EventEmitter<void>` | - |
| `(nzBlur)` | blur callback | `EventEmitter<void>` | - |
Expand Down
3 changes: 3 additions & 0 deletions components/input-number/doc/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,8 @@ import { NzInputNumberModule } from 'ng-zorro-antd';

### nz-input-number

`nz-input-number` 中输入的数值不会在输入时进行校验,而是在特定时机(回车键,上下键,失去焦点等)时才会校验后反馈到 `[ngModel]``(ngModelChange)` 中,否则输入 `-0.12` 或者 `1e10` 这种类型数据时,双向绑定的数据会永远是 `undefined`

| 成员 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| `[ngModel]` | 当前值,可双向绑定 | `number|string``string` | - |
Expand All @@ -40,6 +42,7 @@ import { NzInputNumberModule } from 'ng-zorro-antd';
| `[nzSize]` | 输入框大小 | `'large'|'small'|'default'` | `'default'` |
| `[nzStep]` | 每次改变步数,可以为小数 | `number|string` | `1` |
| `[nzPlaceHolder]` | 选择框默认文字 | `string` | - |
| `[nzId]` | 组件内部 input 的 id 值 | `string` | - |
| `(ngModelChange)` | 数值改变时回调 | `EventEmitter<number>` | - |
| `(nzFocus)` | focus时回调 | `EventEmitter<void>` | - |
| `(nzBlur)` | blur时回调 | `EventEmitter<void>` | - |
Expand Down
43 changes: 22 additions & 21 deletions components/input-number/nz-input-number.component.html
Original file line number Diff line number Diff line change
@@ -1,32 +1,33 @@
<div class="ant-input-number-handler-wrap">
<span unselectable="unselectable"
class="ant-input-number-handler ant-input-number-handler-up"
(mousedown)="up($event)"
(mouseup)="stop()"
(mouseleave)="stop()"
[class.ant-input-number-handler-up-disabled]="disabledUp">
class="ant-input-number-handler ant-input-number-handler-up"
(mousedown)="up($event)"
(mouseup)="stop()"
(mouseleave)="stop()"
[class.ant-input-number-handler-up-disabled]="disabledUp">
<i nz-icon type="up" class="ant-input-number-handler-up-inner"></i>
</span>
<span unselectable="unselectable"
class="ant-input-number-handler ant-input-number-handler-down"
(mousedown)="down($event)"
(mouseup)="stop()"
(mouseleave)="stop()"
[class.ant-input-number-handler-down-disabled]="disabledDown">
class="ant-input-number-handler ant-input-number-handler-down"
(mousedown)="down($event)"
(mouseup)="stop()"
(mouseleave)="stop()"
[class.ant-input-number-handler-down-disabled]="disabledDown">
<i nz-icon type="down" class="ant-input-number-handler-down-inner"></i>
</span>
</div>
<div class="ant-input-number-input-wrap">
<input #inputElement
autocomplete="off"
class="ant-input-number-input"
[disabled]="nzDisabled"
[attr.min]="nzMin"
[attr.max]="nzMax"
[placeholder]="nzPlaceHolder"
[attr.step]="nzStep"
(keydown)="onKeyDown($event)"
(keyup)="onKeyUp()"
[ngModel]="displayValue"
(ngModelChange)="onModelChange($event)">
autocomplete="off"
class="ant-input-number-input"
[attr.id]="nzId"
[disabled]="nzDisabled"
[attr.min]="nzMin"
[attr.max]="nzMax"
[placeholder]="nzPlaceHolder"
[attr.step]="nzStep"
(keydown)="onKeyDown($event)"
(keyup)="onKeyUp()"
[ngModel]="displayValue"
(ngModelChange)="onModelChange($event)">
</div>
1 change: 1 addition & 0 deletions components/input-number/nz-input-number.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@ export class NzInputNumberComponent implements ControlValueAccessor, AfterViewIn
@Input() nzPrecision: number;
@Input() nzPlaceHolder = '';
@Input() nzStep = 1;
@Input() nzId: string;
@Input() @InputBoolean() nzDisabled = false;
@Input() @InputBoolean() nzAutoFocus = false;
@Input() nzFormatter: (value: number) => string | number = value => value;
Expand Down

0 comments on commit a6500c8

Please sign in to comment.