Получить используемые пользователем значения из FormGroup Angular 6 - PullRequest
Новая
       22

Получить используемые пользователем значения из FormGroup Angular 6

0 голосов
/ 30 августа 2018

Я строю панель поиска и использую реактивные формы. У меня есть 12 полей в этой форме (например: fistName, фамилия, адрес ......). Ни одно из полей не назначено «обязательным» в группе форм. Пользователь может ввести любое количество полей для поиска. Есть ли способ, который я мог бы использовать, чтобы найти, сколько полей пользователь ввел. Скажем, пользователь использовал только 5 полей из 12 для поиска, я хочу вернуть 5. Я использовал одиночный поиск, как для каждого поля; 

if (this.searchPanelForm.get('event').value) {
  //increase the count
}

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

И вот как выглядит моя группа форм: 

public searchPanelForm: FormGroup;
constructor(
    private _fb: FormBuilder
) { }
ngOnInit() {
 this.searchPanelForm = this._fb.group({
  name: [''],
  name1: [''],
  name2: [''],
  name3: [''],
  name4: [''],
  name5: [''],
  name6: [''],
  name7: [''],
  name8: ['']
});
}

Спасибо

1 Ответ

0 голосов
/ 12 сентября 2018

Когда вы отправляете форму, вы клонируете значение формы и сохраняете его в переменной, скажем, oldFormValue, а затем, когда вам нужно выяснить, сколько полей было введено впоследствии, вы можете сравните предыдущее значение формы и новое, как показано ниже 

getNumberOfFieldsChanged(newFormValue, oldFormValue) {
  return Object.keys(oldFormValue)
               .reduce((sum, nextKey) -> {
                 if (oldFormValue[nextKey] !== newFormValue[nextKey])
                   sum++;
                 return sum;
               }, 0);
}

Вы должны клонировать значение формы и присвоить его переменной oldFormValue, иначе новое и старое значения будут ссылаться на один и тот же объект, что приведет к тому, что приведенный выше метод всегда будет возвращать 0

...