Get name of Form Control

ararb78 picture ararb78 · Dec 15, 2017 · Viewed 18.9k times · Source

I'm working with reactive forms in angular, I need to compare the start date "start date" with the end date "end date", both controls are validated in the "dateLessThan" function, but the problem is that I do not know how to ask for control is evaluating

//Some stuff
public fechaInicio = new FormControl('', [
    Validators.required    
    , this.dateLessThanTo

]);
public fechaFin = new FormControl('', [
    Validators.required     
    , this.dateLessThan
]);



 createForm() {
    this.contratoForm = this.formBuilder.group({    
        fechas: this.formBuilder.group({
            fechaInicio: this.fechaInicio,
            fechaFin: this.fechaFin
        }, { validator: this.dateLessThan('fechaInicio', 'fechaFin') }),          

    });
}

Here I Need to know the name of control for compare dates:

 dateLessThanTo(fieldControl: FormControl) {
    //
    //if (fechaInicio.value > FechaFin.value){
    //      return true;
    //}
    //else{
    //  return false;
    //  }

}

//Some stuff

Answer

jcroll picture jcroll · May 9, 2018

Get the parent group from the control and then compare to the current control:

  dateLessThanTo(control: AbstractControl) { 
    let name = this.getName(control);

    ...
  }

  private getName(control: AbstractControl): string | null {
    let group = <FormGroup>control.parent;

    if (!group) {
      return null;
    }

    let name: string;

    Object.keys(group.controls).forEach(key => {
      let childControl = group.get(key);

      if (childControl !== control) {
        return;
      }

      name = key;
    });

    return name;
  }