重写来自自定义窗体控件的获取值函数

Question

我正在尝试在 angular2 上创建自定义表单控件，当我尝试获取所有表单的值时遇到问题

this.form_c.value

我想重写自定义窗体控件的 get 值

我

试图找出我是否可以做类似的事情，但没有成功

private _val:any;
@Input set value(x:any) {
...this._val = x;
}
get value {
return this._val + "My mod";
}

Answer 1

下面是如何使用 Angular 中的响应式表单创建自定义表单的示例：

import { Component } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  public myForm: FormGroup;
  constructor(private fb: FormBuilder) {
    this.myForm = this.fb.group({
      firstName: null,
      lastName: null
    });
  }

如何从表单元素获取和设置值：

this.myForm.get('firstName').value;
this.myForm.get('lastName').setValue('Smith');

导入验证器以设置特定表单元素的要求：

import { Validators } from '@angular/forms';
this.myForm = this.fb.group({
    firstName: [null, Validators.required],
    lastName: [null, Validators.maxLength(16)]
})

在 HTML 中使用表单：

<form [formGroup]="myForm">
    <input type="text" formControlName="firstName" />
</form>

有关反应式表单的更多信息。