Как использовать угловой Hostlistener при загрузке компонента - PullRequest
Новая
       9

Как использовать угловой Hostlistener при загрузке компонента

0 голосов
/ 05 июня 2018

В моем угловом приложении я использую директиву, которая форматирует число.Эта директива используется в html, как показано ниже.

HTML

TYPESCRIPT 

 @Directive({
  selector: '[numFormatter]',
})
export class FormatterDirective implements OnInit {
  private el: HTMLInputElement;
  constructor(
    private elementRef: ElementRef,
    private currencyPipe: NumberPipe
  ) {
    this.el = this.elementRef.nativeElement;
  }
    ngOnInit() {
   this.el.value = this.currencyPipe.transform(this.el.value);
  }

   @HostListener('focus', ['$event.target.value'])
   onFocus(value) {
     this.el.value = this.currencyPipe.parse(value); // opossite of transform
  }

   @HostListener('focusout', ['$event.target.value'])
   onBlur(value) {
     this.el.value = this.currencyPipe.transform(value);
   }
  }

Директива хорошо работает, когда мы фокусируемся на поле.Я хочу использовать эту директиву при загрузке компонента, чтобы при наличии значения в поле inout его форматировали.Не уверен, что II следует использовать HostBinding или использовать другой подход.

...