mat-select in multiple mode is difficult to use with reactive forms
- Dominant language
- TypeScript
- Stars
- 25k
- Forks
- 6.8k
- Avg merge
- 1d 8h
- Merged PRs (30d)
- 91
Description
#### 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 `formControl`s 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?
Contributor guide
Research direction
Start by reproducing the reported mat-select multiple-mode setup with Angular reactive forms, focusing on formControl behavior for the select versus individual options and their valueChanges. Done means users can bind and prepopulate individual option controls without manually synchronizing an array, with the supported form API and behavior documented by tests.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100