angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.37k stars 6.74k forks source link

mat-select in multiple mode is difficult to use with reactive forms #11006

Open adamdport opened 6 years ago

adamdport commented 6 years ago

Bug, feature request, or proposal:

feature request

What is the expected behavior?

mat-select in multiple mode lets me put formControls on individual options

What is the current behavior?

I have a list of boolean options (checkboxes) that a user can set. formControl only works on the mat-select, which is populated with an array. If I want to prepopulate those, I need to manually build an array to set on my mat-select. I cannot bind to valueChanges on individual options.

What is the use-case or motivation for changing an existing behavior?

Manually keeping this array updated and in sync with my individual settings is painful. I'd rather create formControls for each option, which I can bind to and set/patch as I need to. Perhaps let me set a formGroup on the mat-select instead of a formControl?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

"@angular/core": "5.2.9",
"@angular/material": "5.2.4",
"typescript": "2.8.1"

Is there anything else we should know?

maghidini commented 6 years ago

It seems to be more natural to use formArray instead of formControl

AnthonyNahas commented 1 year ago

I am facing the same issue! Whenever I use formcontrol with mat-select in multiple mode it works when the initialized value is null but not with an initialized value as array

jkruse commented 1 year ago

Have same issue. And it should support both individual (boolean valued) form controls on each option, and a form array of such controls. Sometimes you might not want to collect the values in an array, but as properties on an object (form group).