|
| 1 | +import {Directive} from 'angular2/src/core/metadata'; |
| 2 | +import {ElementRef} from 'angular2/src/core/linker'; |
| 3 | +import {Renderer} from 'angular2/src/core/render'; |
| 4 | +import {Self, forwardRef, Provider} from 'angular2/src/core/di'; |
| 5 | +import {NG_VALUE_ACCESSOR, ControlValueAccessor} from './control_value_accessor'; |
| 6 | +import {isBlank, CONST_EXPR, NumberWrapper} from 'angular2/src/core/facade/lang'; |
| 7 | +import {setProperty} from './shared'; |
| 8 | + |
| 9 | +const NUMBER_VALUE_ACCESSOR = CONST_EXPR(new Provider( |
| 10 | + NG_VALUE_ACCESSOR, {useExisting: forwardRef(() => NumberValueAccessor), multi: true})); |
| 11 | + |
| 12 | +/** |
| 13 | + * The accessor for writing a number value and listening to changes that is used by the |
| 14 | + * {@link NgModel}, {@link NgFormControl}, and {@link NgControlName} directives. |
| 15 | + * |
| 16 | + * # Example |
| 17 | + * ``` |
| 18 | + * <input type="number" [(ng-model)]="age"> |
| 19 | + * ``` |
| 20 | + */ |
| 21 | +@Directive({ |
| 22 | + selector: |
| 23 | + 'input[type=number][ng-control],input[type=number][ng-form-control],input[type=number][ng-model]', |
| 24 | + host: { |
| 25 | + '(change)': 'onChange($event.target.value)', |
| 26 | + '(input)': 'onChange($event.target.value)', |
| 27 | + '(blur)': 'onTouched()' |
| 28 | + }, |
| 29 | + bindings: [NUMBER_VALUE_ACCESSOR] |
| 30 | +}) |
| 31 | +export class NumberValueAccessor implements ControlValueAccessor { |
| 32 | + onChange = (_) => {}; |
| 33 | + onTouched = () => {}; |
| 34 | + |
| 35 | + constructor(private _renderer: Renderer, private _elementRef: ElementRef) {} |
| 36 | + |
| 37 | + writeValue(value: number): void { setProperty(this._renderer, this._elementRef, 'value', value); } |
| 38 | + |
| 39 | + registerOnChange(fn: (_: number) => void): void { |
| 40 | + this.onChange = (value) => { fn(NumberWrapper.parseFloat(value)); }; |
| 41 | + } |
| 42 | + registerOnTouched(fn: () => void): void { this.onTouched = fn; } |
| 43 | +} |
0 commit comments