从自定义FormControl

时间:2018-01-18 02:53:32

标签: angular angular-forms

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

this.form_c.value

我想覆盖自定义表单控件的获取值

我试图找出能做的事情,但没有成功

private _val:any;
@Input set value(x:any) {
...this._val = x;
}

get value {
return this._val + "My mod";
}

1 个答案:

答案 0 :(得分:0)

以下是如何使用Angular中的Reactive Forms创建自定义表单的示例:

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>

More Info关于活跃表格。