根据数字格式，您可以使用type="number"输入。
至于验证，请在需要验证更改的每个FormControl中使用updateOn: 'change'选项，如下所示：

mobile: [
    null, {
        validators: [
            // your validators here
        ],
        asyncValidators: [
            // your async validators here
        ],
        updateOn: 'change'
    }
]

这样，每当控件的值改变时，即每次按键时，验证器都会被调用。

下一次你可以添加你的代码。你必须创建一个文本来显示当他们是一个错误的字段，或添加一些东西，如红色边框的输入

<div [formGroup]="form">
  <label for="title" class="text-muted text-sm">Title</label>
  <span
    class="text-danger"
    *ngIf="form.get('title').errors &&
        form.get('title').hasError('required')">min 2 length</span>
  <input id="title" type="text" placeholder="" formControlName="title">
</div>

在 typescript 上（不要忘记导入formGroup和formBuilder）

form: FormGroup = new FormGroup({});

constructor(private fb: FormBuilder) {
  this.form = this.fb.group({
  title: ['', [Validators.required, Validators.minLength(2)]]
  });
}

在CSS上

.text-danger{
   color: red
 }

你也可以直接在输入上添加这个代码（并在css类中创建有效和无效）

[class.valid]="formGroup.get('title').valid && 
    (formGroup.get('title').dirty || formGroup.get('title').touched)"
[class.invalid]="formGroup.get('title').invalid && 
    (formGroup.get('title').dirty || formGroup.get('title').touched)"

试试这个名为React-hook-form的库
在这个库中，有4 stages of getting data从表单输入.
最近，我用了它，它是非常惊人的，直接向前使用...请访问官方网站，并观看这2个视频。