Преобразование входного значения в FormControl - PullRequest
0 голосов
/ 16 декабря 2018

У меня есть случай в приложении Angular, где мне нужно принять значение десятичного числа в элементе управления.Проблема в том, что он должен принять число с запятой или точкой (как знак десятичной точки), а затем преобразовать его в правильный формат (скажем, ххх ххх ххх, уу).Это ДОЛЖНО быть реактивное решение формы.До сих пор я выполнял указанную ниже директиву, она прекрасно работает, но мне нужно преобразовать записанное значение в соответствующий формат и затем передать его в свойство связанного formControl.Теперь это не затрагивается, когда я набираю 1023.20 и 1023,20, преобразования не происходит, и я не могу использовать значение в математических операциях (они показывают мне значение NaN).Есть ли способ добиться такого поведения в реактивных формах углов?

import { Directive, ElementRef, OnInit, HostListener } from '@angular/core';
import { DecimalPipe } from '@angular/common';
import { Logger } from '@app/core';
import { NgControl } from '@angular/forms';

const log = new Logger("DecimalNumberFormatterDirective");

@Directive({
  selector: '[decimalNumberFormatter]',
  providers: [DecimalPipe]
})
export class DecimalNumberFormatterDirective implements OnInit {

  private el: HTMLInputElement;

  private _format: string = "1.2-2";
  private _locale: string = "somelocale";

  constructor(private elementRef: ElementRef, private decimalPipe: DecimalPipe, private control: NgControl) {
    this.el = elementRef.nativeElement;
  }

  ngOnInit(): void {
    this.el.value = this.transformValue(this.el.value);

  }

  @HostListener("change", ["$event", "$event.target.value"])
  onBlur(event: any, value: any) {
    log.debug(value);
    let str = this.parseNumber(value);
    this.el.value = this.transformValue(str);

  }


  transformValue(value: any): string {
    let currency = this.decimalPipe.transform(value, this._format, this._locale);
    return currency.trim();
  }
  parseNumber(str: string): number {
    return parseFloat(str.replace(" ", "").replace(",", "."))
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...