Как использовать валютные трубы в угловой реактивной форме и валидатор - PullRequest
Новая
       34

Как использовать валютные трубы в угловой реактивной форме и валидатор

0 голосов
/ 16 октября 2019

Я использую угловую реактивную форму с валидатором (значение> 0). В моей модели мои данные представляют собой BigDecimal (5.80 для примера): 

this.userInfoFormGroup = this.formBuilder.group({
    money:[this.price, this.positiveVal()], 
});

Я использую валютный канал: 

<input type="text" class="form-control" formControlName="money" [value]="userInfoFormGroup.get('money')?.value | currency:'EUR'">

Мой код доступен онлайн ЗДЕСЬ

Моя проблема в том, что первоначальное значение 5,8 преобразуется трубкой в ​​5,8 евро. Как использовать трубу только для дисплея, а не для модели?

Я воспроизводлю проблему, когда я изменяю, например, 5,8 на 5,9. НО мое приложение меняет 5,8 на 5,90 евро, а мой валидатор - КО, потому что € - это NaN.

1 Ответ

2 голосов
/ 17 октября 2019

Вы можете сделать это: 

<input type="text" class="form-control" formControlName="money" [value]="getNumberVal(userInfoFormGroup.get('money')?.value) | currency:'EUR'">

getNumberVal(val: string): number {
  val = `${val}`;
  return parseFloat(val.replace(/\u20AC/g, ''));
}

positiveVal(): ValidatorFn {
  return (control: AbstractControl): {[key: string]: any} | null => {
    const invalid = this.getNumberVal(control.value) <= 0;
    return invalid ? {'positiveVal': {value: control.value}} : null;
};

Полная демонстрация онлайн

...