Angular2에서 폼 검증기를 트리거하는 방법

Angular2에서 폼 검증기를 트리거하는 방법

angular2에서 다른 컨트롤이 변경될 때 일부 컨트롤에 대해 Validator를 트리거하려고 합니다.양식에 재검증을 요청할 수 있는 방법이 있습니까?더 좋은 것은 특정 분야에 대한 유효성 검사를 요청할 수 있습니까?

예: 확인란 X와 P를 입력합니다.입력 P에는 X의 모형 값에 따라 다르게 동작하는 검증자가 있습니다.X를 선택/선택 해제하면 P에서 검증자를 호출해야 합니다.P의 검증자는 모형을 검토하여 X의 상태를 확인하고 그에 따라 P를 검증합니다.

다음 코드가 있습니다.

constructor(builder: FormBuilder) {
    this.formData = { num: '', checkbox: false };

    this.formGp = builder.group({
        numberFld: [this.formData.num, myValidators.numericRange],
        checkboxFld: [this.formData.checkbox],
    });
}

this.formGp.controls['checkboxFld'].valueChanges.observer({
    next: (value) => {
        // I want to be able to do something like the following line:
        this.formGp.controls['numberFld'].validator(this.formGp.controls['numberFld']);
    }
});

해결책 있는 사람?감사합니다!

아직도 답을 찾고 계신지 모르겠습니다. 그래서 제 제안은 다음과 같습니다.

이것을 확인해 보십시오.각도 2 - 추상 컨트롤

당신이 할 수 있는 일은 다음과 같습니다.

this.formGp.controls['checkboxFld'].valueChanges.observer({
    next: (value) => {
       this.formGp.controls['numberFld'].updateValueAndValidity();
    }
});

그러면 검증자가 트리거되고 실행됩니다.또한 상태도 업데이트됩니다.이제 검증자 로직 내에서 확인란 값을 참조할 수 있습니다.

Validaton-가이드

FormControl

ControlGroup을 사용하여 터치 여부를 확인하는 데 오류가 있기 때문에 이 작업을 수행합니다.

for (var i in this.form.controls) {
  this.form.controls[i].markAsTouched();
}

(이 .form이 내 ControlGroup입니다)

이 블로그의 도움으로

블로그 링크

나는 Nightking 답변의 조합으로 해결책을 발견했습니다.

Object.keys(this.orderForm.controls).forEach(field => {
       const control = this.orderForm.get(field);
       control.updateValueAndValidity();

});

이.orderForm은 폼 그룹입니다.

이것은 나에게 효과가 있었습니다.

this.myForm.markAllAsTouched();

이 동작을 모델링하는 더 우아한 방법이 있습니다. 예를 들어, 상태를 ReplaySubject에 넣고 관찰한 다음 상태를 관찰하는 비동기 검증기를 사용합니다. 하지만 아래의 유사 코드화된 접근 방식이 작동해야 합니다.확인란에서 값 변화를 관찰하고 필요에 따라 모형을 업데이트한 다음 숫자를 강제로 다시 검증합니다.updateValueAndValidity Cal을 사용하여 필드를 만듭니다.

constructor(builder: FormBuilder) {
  this.formData = { num: '', checkbox: false };
  const numberFld = builder.control(this.formData.num, myValidators.numericRange);

  const checkbox = builder.control(this.formData.checkbox);
  checkbox.valueChanges.map(mapToBoolean).subscribe((bool) => {
    this.formData.checked = bool;
    numberFld.updateValueAndValidity(); //triggers numberFld validation
  });

  this.formGp = builder.group({
      numberFld: numberFld,
      checkboxFld: checkbox
  });
}

다음과 같은 방법으로 유효성 검사를 트리거할 수 있습니다.

this.myform.get('myfield').updateValueAndValidity();

MarkAsDirty 및 updateValueAndValidity를 사용하는 또 다른 유사한 방법이 있습니다. 특히 As를 표시하는 각도 재료를 사용하는 경우 유용합니다.만지는 것만으로는 충분하지 않습니다.

export function forceValidation(form: AbstractControl) {
  if (form instanceof FormGroup || form instanceof FormArray) {
    for (const inner in form.controls) {
      const control = form.get(inner);
      control && forceValidation(control);
    }
  } else {
    form.markAsDirty();
    form.markAsTouched();
    form.updateValueAndValidity();
  }
}

static minMaxRange(min: number, max: number): ValidatorFn {
    return (control: AbstractControl): ValidationErrors | null => {
        if (Validators.min(min)(control)) { // if min not valid
            return Validators.min(min)(control);
        } else {
            return Validators.max(max)(control);
        }
    };
}

언급URL : https://stackoverflow.com/questions/32260082/how-to-trigger-form-validators-in-angular2