独特的角度反应形式

时间:2018-02-20 09:25:43

标签: angular forms angular-reactive-forms angular4-forms reactive-forms

我对Angular 4反应形式有疑问。

我的申请是一个培训项目。它在SpringBoot中有一个Backend,mySql数据库和Angular4中的表单。

此应用程序必须将医生添加到数据库,但也必须验证:许可证编号必须是唯一的。我使用的是Reactive Forms(不是模板驱动的)。

我尝试用函数解决我的问题:

    import { AbstractControl } from "@angular/forms";



export function  ControlLicenseNumber(c: AbstractControl):  string | null {
  const formGroup = c.parent.controls;
  return Object.keys(formGroup).find(license_number => c === formGroup[license_number])  || null;
 }

但我不知道如何将它注入我的formControl:

   constructor(private doctorsService: DoctorsService,
              private location: Location,
              private fb: FormBuilder) {
                this.rForm = new FormGroup({ 
                'name': new FormControl('', Validators.required),
                'surname': new FormControl('', Validators.required),
                'phone': new FormControl('', Validators.required),
                'nationality': new FormControl('', Validators.required),
                'email': new FormControl('', Validators.email),
                'license_number': new FormControl('', [Validators.required, ControlLicenseNumber])})
                 }
希望你能帮助我们。问候

1 个答案:

答案 0 :(得分:0)

试试这样: -

constructor(private doctorsService: DoctorsService,
          private location: Location,
          private fb: FormBuilder) {
            this.rForm = this.fb.group({({ 
              name           : ['', [Validators.required]],
              surname        : ['', [Validators.required]],
              phone          : ['', [Validators.required],
              nationality    : ['',[Validators.required]],
              email          : ['', Validators.email],
              license_number : ['', [Validators.required]
              },
             {
                validator: this.ControlLicenseNumber
           });
}

ControlLicenseNumber(c: AbstractControl){
  const value = c.get('license_number').value;
  return Object.keys(value).find(license_number => c === 
  value)  || null;
}