【问题标题】:NgModel.viewToModelUpdate not works when define a Form Control on Input在输入上定义表单控件时,NgModel.viewToModelUpdate 不起作用
【发布时间】:2018-06-20 20:45:18
【问题描述】:

我想通过指令更改带有 onBlur 事件的输入的视图和模型数据。

我写了这个函数来更新视图和模型:

@HostListener('blur',['$event'])
  blur(e:Event){
    const target:HTMLInputElement = <HTMLInputElement>e.target;
    const val = this.decimalPipe.transform(target.value.replace(/\,/g,''),'1.2-2');
    this.ngModel.viewToModelUpdate(Number(val.replace(/\,/g,'')));
    this.ngModel.valueAccessor.writeValue(val);
  }

这很好用,但是当我想在输入 this.ngModel.viewToModelUpdate 上定义表单控件时,不会影响模型。

表单组代码:

form = new FormGroup({amountInput:new FormControl('',Validators.min(this.traderService.trader.sMPA)),
  });

它看到忽略这个函数并将模型设置为字符串。如何将模型更新为数字?

【问题讨论】:

    标签: javascript angular angular-ngmodel angular-directive ngmodel


    【解决方案1】:

    尝试使用:

    this.ngModel.control.patchValue(Number(val.replace(/\,/g,'')));
    

    而不是

    this.ngModel.viewToModelUpdate(Number(val.replace(/\,/g,'')));
    

    在 Angular 5 上使用 formControl 进行输入的自定义指令也有同样的问题。

    【讨论】:

    • 你使用viewChild获取ngModel属性了吗?
    • 作为补充,您可以使用this.ngModel.valueAccessor.writeValue 来呈现不同的视图值。
    猜你喜欢
    • 2017-01-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多