如何在设置或获取它之前拦截FormControl的值？

这个问题很明显。我想拦截FormControl的value属性的传入值，并且能够截取它所连接的HTML控件的传出值。如何在设置或获取它之前拦截FormControl的值？

比方说，我有一个名为“名字”，我把它挂到一个文本框，这样FormControl：

<input type="text" formControlName="firstName" />

默认情况下，当用户在文本框中输入值，并提交不同，FormControl的价值被设置为文本框中的值。有什么方法可以拦截在设置之前设置并修改的值？

同样，是否有任何方法来截获FormControl发送到HTML控件的值？例如，如果我有一个FormControl的值设置为某些东西，但我想修改显示在文本框中的值。

我知道我可以使用ngModel作为窗体和控件之间的中介，但是当使用多个控件时会变得麻烦。我也知道你可以创建自己的控件并实现ControlValueAccessor，但这也很麻烦，因为我必须为每个要使用的控件创建相应的控件。

有关为什么我问这个问题的更多信息，请参阅https://github.com/ionic-team/ionic/issues/7121

来源

2017-08-08 Anshul

你可以创建plunker吗？你想输入'3'并获得'777'吗？ – yurzui

基本上，是的。我想要的是用户输入1，表单控制值设置为0.01。如果表单控件值为0.01，则文本框应该显示1. – Anshul

您可以使用的onblur调用一个函数（即modifyValue()），然后利用patchValue修改值：

<input type="text" onblur="modifyValue()" formControlName="firstName" /> 

modifyValue() { 
    this.form.patchValue({ 
     firstName: this.form.firstName //modify firstName here 
    }) 
}

如果这样的作品，你可以创建一个通用的功能，为了键/值传递给修补它，而不必创建一堆的特定功能

<input type="text" onblur="modifyValue('firstName')" formControlName="firstName" /> 

    modifyValue(key) { 
     this.form.controls[key].patchValue(this.form.controls[key] // modify value here) 
    }

来源

2017-08-09 07:05:05

如果我使用onBlur手动设置表单值，为什么我需要formControlName =“firstName”？再次，问题是可扩展性。此解决方案适用于小型实例。但是当你有一个需要改变的很多领域的表单时，你会得到大量的样板代码。 – Anshul

如何在设置或获取它之前拦截FormControl的值？

回答

相关问题