Угловая реактивная форма, не заполняющаяся новым массивом

#angular

#угловая

Вопрос:

У меня есть реактивная форма в моем приложении angular, и я пытаюсь отправить форму, которая включает массив.

В моем ngOnInit () я заполняю форму следующим образом:

   this.userForm = this.fb.group({
    id: [result.id, Validators.required],
    firstName: [result.firstName, Validators.required],
    lastName: [result.lastName, Validators.required],
    roles: this.fb.array([])
  });
  

При отправке формы я пытаюсь добавить содержимое строкового массива в свою форму.

Я добавляю свой массив строк в форму следующим образом:

 this.userForm.controls.roles = this.roles.filter(x=>x.selected == true).map(x=>x.name)
  

Кажется, это работает:

 console.log(this.userForm.controls.roles)
  

дает мне:

 ["Administrator", "Manager"]
  

Однако, когда я проверяю содержимое моей пользовательской формы (которую я отправляю), roles пуста:

 console.log(this.userForm.value)

firstName: "John"
id: "4efba5d3-1875-4496-aeca-6f372924a700"
lastName: "Smith"
roles: []
  

Что я делаю не так?

Комментарии:

1. Вы присваиваете массив или строки ([«Администратор», «Менеджер»]) массиву AbstractControl.

Ответ №1:

попробуйте использовать this.userForm.patchValue({roles: this.roles.filter(x=>x.selected == true).map(x=>x.name)}) вместо изменения элементов управления формы.

Ответ №2:

Не

 this.userForm.controls.roles = this.roles.filter(x=>x.selected == true).map(x=>x.name)
  

вместо этого выполните

 this.userForm.patchValue(
   { roles: this.roles.filter(x=>x.selected == true).map(x=>x.name) }
);