@ -5,7 +5,7 @@
* Copyright ( c ) Sebastian Stehle . All rights reserved * Copyright ( c ) Sebastian Stehle . All rights reserved
* / * /
import { Directive , forwardRef , ElementRef , Renderer } from '@angular/core' ; import { Directive , forwardRef , ElementRef , HostListener , Renderer } from '@angular/core' ;
import { ControlValueAccessor , NG_VALUE_ACCESSOR } from '@angular/forms' ; import { ControlValueAccessor , NG_VALUE_ACCESSOR } from '@angular/forms' ;
const NOOP = ( ) = > { /* NOOP */ } ; const NOOP = ( ) = > { /* NOOP */ } ;
@ -16,10 +16,7 @@ export const SQX_LOWERCASE_INPUT_VALUE_ACCESSOR: any = {
@Directive ( { @Directive ( {
selector : '[sqxLowerCaseInput]' , selector : '[sqxLowerCaseInput]' ,
providers : [ SQX_LOWERCASE_INPUT_VALUE_ACCESSOR ] , providers : [ SQX_LOWERCASE_INPUT_VALUE_ACCESSOR ]
host : {
'(input)' : 'onChange($event.target.value)' , '(blur)' : 'onTouched()'
}
} ) } )
export class LowerCaseInputDirective implements ControlValueAccessor { export class LowerCaseInputDirective implements ControlValueAccessor {
private changeCallback : ( value : any ) = > void = NOOP ; private changeCallback : ( value : any ) = > void = NOOP ;
@ -31,6 +28,19 @@ export class LowerCaseInputDirective implements ControlValueAccessor {
) { ) {
} }
@HostListener ( 'onChange' , [ '$event.target.value' ] )
public onChange ( value : any ) {
const normalizedValue = ( value == null ? '' : value . toString ( ) ) . toLowerCase ( ) ;
this . renderer . setElementProperty ( this . element . nativeElement , 'value' , normalizedValue ) ;
this . changeCallback ( normalizedValue ) ;
}
@HostListener ( 'blur' )
public onTouched() {
this . touchedCallback ( ) ;
}
public writeValue ( value : any ) { public writeValue ( value : any ) {
const normalizedValue = ( value == null ? '' : value . toString ( ) ) . toLowerCase ( ) ; const normalizedValue = ( value == null ? '' : value . toString ( ) ) . toLowerCase ( ) ;
@ -48,15 +58,4 @@ export class LowerCaseInputDirective implements ControlValueAccessor {
public registerOnTouched ( fn : any ) { public registerOnTouched ( fn : any ) {
this . touchedCallback = fn ; this . touchedCallback = fn ;
} }
public onChange ( value : any ) {
const normalizedValue = ( value == null ? '' : value . toString ( ) ) . toLowerCase ( ) ;
this . renderer . setElementProperty ( this . element . nativeElement , 'value' , normalizedValue ) ;
this . changeCallback ( normalizedValue ) ;
}
public onTouched() {
this . touchedCallback ( ) ;
}
} }
Sebastian Stehle
9 years ago