Реактивные формы Угловая формаГруппа - PullRequest
1 голос
/ 09 июля 2019

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

Это то, что у меня есть сейчас, я попытался добавить Validators.required RequiredValidatonOnlyOne () . Можно ли добавить какую-то пользовательскую проверку, которая будет проверять, что пользователь вводит что-то только в один вход

 this.formGroup = this.formBuilder.group({
      lastName: [{ value: '', disabled: false }, [Validators.maxLength(50), Validators.required]],
      phones: this.formBuilder.group({
        phone: [{ value: '', disabled: false }],
        phone2: [{ value: '', disabled: false }],
        mobile: [{ value: '', disabled: false }],
      }, this.RequiredValidatonOnlyOne())
    });


  private RequiredValidatonOnlyOne(){
    return (controlGroup) => {
      const controls = controlGroup.controls;
      if (controls) {
        const theOne = Object.keys(controls).find(key => controls[key].valid);
        if (!theOne) {
          return {
            atLeastOneRequired: {
              text: 'At least one should be selected'
            }
          };
        }
      }
      return null;
    };
  }

Ответы [ 2 ]

2 голосов
/ 09 июля 2019
RequiredValidatonOnlyOne()
  {
    return (controlGroup:FormGroup)=>{
      const controls = controlGroup.controls;
      let valid:boolean=false;
      return Object.keys(controls).find(key => controlGroup.get(key).value)?null
             :{requiredOne:"required one"}
    }
  }

Извините и обновлен: в Angular 8 изменился formBuilder, используйте {validator:this.RequiredValidatonOnlyOne()}, чтобы добавить валидатор в formGroup, см. stackblitz

this.formGroup = this.formBuilder.group({
      lastName: [{ value: '', disabled: false }, [Validators.maxLength(50), Validators.required]],
      phones: this.formBuilder.group({
        phone: [{ value: '', disabled: false }],
        phone2: [{ value: '', disabled: false }],
        mobile: [{ value: 'aaa', disabled: false }],
      }, {validator:this.RequiredValidatonOnlyOne()})
    });
  }

Вам нужен поискЭлемент управления со значением, а не, если он действителен (действительны всегда, потому что внутри элементов управления нет валидаторов, и они не должны иметь -)

0 голосов
/ 09 июля 2019

подход, который я вижу, clearValidators().установить (change) прослушиватель событий на всех элементах управления.вызовите функцию при изменении, передайте formcontrol в качестве аргумента и очистите валидаторы других элементов управления, кроме этого.если вход пуст, то setvalidators() снова на всех элементах управления.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...