角2 |触发ngSubmit时如何设置大写所有值

时间:2017-07-11 02:29:17

标签: angular

触发ngSubmit时如何设置全部大写输入值。我们可以在这里做管道,但我想知道它们是否是我们在提交时可以设置为大写所有输入值的任何其他方式。

1 个答案:

答案 0 :(得分:3)

如果您使用的是ReactiveForms,那么在提交之前转换文本应该非常简单。

第1步:注入!var2!

@echo off

setlocal ENABLEDELAYEDEXPANSION

set var1=1
echo var1 = %var1%
set var2=var1 init value : %var1%, var1 delayed value : ^^^!var1^^^!

set var1=2
echo var1 = %var1%
echo var2 = %var2%

步骤2:使用管道转换您的值:

UpperCasePipe

注意:constructor(private uppercasePipe: UpperCasePipe) { } 将更新表单值,也就是用户可以在表单(html)中逐字地看到更新为全部大写。如果您只想静默转换值并发布到服务器,请不要使用onSubmit() { //get the current input value of the form const username = this.myForm.controls.username.value; //tranform the field to uppercase const usernameUpperCase = this.uppercasePipe.transform(username); //patch the field myForm.controls.username.patchValue(usernameUpperCase); }

patchValue

提醒:

请记住导入必要的模块。 patchValue位于onSubmit() { let formData = this.myForm.value; formData.username = this.uppercasePipe.transform(formData.username); //post to server without updating the form value myService.postToServer(formData); }

编辑:

如果您使用UpperCasePipe,只需转换组件中的该属性:

HTML:

@angular/common

组件:

[(ngModel)]

阅读文档。它们很有帮助,包含您需要的一切。

https://angular.io/api/forms/NgModel

https://angular.io/api/common/UpperCasePipe