Подтвердить что ты не робот

Angular2: узнать, требуется ли FormControl для валидатора?

кто-то знает способ узнать для Angular2 FormControl, если для элемента управления зарегистрирован необходимый флажок.

this.form = builder.group({name: ['', Validators.required]};

Можно ли запросить элемент управления this.form.controls['name'], если это обязательное поле? Я знаю, что могу проверить, действительно ли это, но это не то, что я хочу.

С уважением, Марк

4b9b3361

Ответ 1

Эта функция должна работать для FormGroups и FormControls

  export const hasRequiredField = (abstractControl: AbstractControl): boolean => {
    if (abstractControl.validator) {
        const validator = abstractControl.validator({}as AbstractControl);
        if (validator && validator.required) {
            return true;
        }
    }
    if (abstractControl['controls']) {
        for (const controlName in abstractControl['controls']) {
            if (abstractControl['controls'][controlName]) {
                if (hasRequiredField(abstractControl['controls'][controlName])) {
                    return true;
                }
            }
        }
    }
    return false;
};

Ответ 2

В то время как нет API для непосредственного поиска, если требуемый валидатор установлен для определенного поля, раунд для достижения этого выглядит следующим образом:

    this.required = false;
    let formControl = new FormControl();
    if (this.formGroup.controls[this.name].validator) {
        let validationResult = this.formGroup.controls[this.name].validator(formControl);
        this.required = (validationResult !== null && validationResult.required === true);
    }

Я тестировал это, и это срабатывает, только если валидатор Validator.Required добавлен в конкретный FormControl.

Ответ 3

Нет способа проверить валидаторы или получить все валидаторы: https://github.com/angular/angular/issues/13461

Решение

@fairlie-agile довольно умное. Но я думаю, что мы должны использовать пустой FormControl, потому что нам нужен огонь, необходимый валидатор, и this.group.controls[this.config.name] может быть уже инициализирован с некоторым значением.

ngOnInit() {
    let formControl = this.group.controls[this.config.name];
    let errors: any = formControl.validator && formControl.validator(new FormControl());
    this._required = errors !== null && errors.required;
}

Ответ 4

У меня подобная проблема. Пока я использую это:

  import { Attribute } from '@angular/core';

  // "Kind-of" hack to allow "pass-through" of the required attribute
  constructor(@Attribute('required') public required) {
    // call super here if the component is an ancestor
  }

Я действительно озадачен тем, почему свойства, такие как "отключенные", включены в FormControl, но не "требуются".

Ответ 5

Один из способов сделать это - проверить правильность элемента управления, когда форма загружена, чтобы увидеть, имеет ли она требуемую ошибку (что будет, если поле пусто).

Это не будет работать для других валидаторов, таких как minLength, поскольку они не запускаются до тех пор, пока элемент управления не будет изменен.

export class FormInputComponent implements Field, OnInit {
  private _required: boolean;
  config: FieldConfig;
  group: FormGroup;

    /** Readonly properties. */
  get required(): boolean { 
    return this._required;
  }

  ngOnInit() {
    var _validator: any = this.group.controls[this.config.name].validator && this.group.controls[this.config.name].validator(this.group.controls[this.config.name]);
    this._required = _validator && _validator.required;
  }
}

Ответ 6

Этот ответ работает с динамическими формами

Не уверен, что это нарушает наилучшую практику или нет, добавив к объекту FormControl.

Я следил за кулинарной книгой динамических форм из Angular, и я удалил требуемое поле и добавил поле валидаторов.

Затем я добавил это к компоненту вопроса (я переименовал вопрос в поле)

get isRequired() { return this.field.validators.indexOf(Validators.required) !== -1; }

Ответ 7

Я не знаю, какой именно способ проверить, требует ли контроль валидатор или нет.

Но обходным путем может быть это, Всякий раз, когда элемент управления требует валидатора, он добавляет к этому элементу функцию validator().

например.

<input type="text" formControlName="firstname">

constructor(private formBuilder: FormBuilder){
    this.registerForm = this.formBuilder.group({
        firstname: ['', Validators.required]     //<<<===one required validation on firstname control
    });

    console.log(this.registerForm.controls.firstname.validator.length);
                                                 //<<<===this will return 1.
   });

}

В приведенном выше коде длина валидатора равна единице (1)


  console.log(this.registerForm.controls.firstname.validator.length);
                                                 //this will return exception

эта строка вернет ее. Если валидатор не подключен, то firstname не будет иметь функцию validator(), поэтому в этом случае я дам исключение.

DEMO: https://plnkr.co/edit/I7b5JNAavmCJ6Py1eQRr?p=preview