angular / angular/components

bug(CHIPS): chip-listbox is setting formControl as undefined after unselection - inconsistency with .setValue(null)

Abierto
#32,084 1 comentario 0 reacciones 0 asignados Ver en GitHub
area: material/chips P3
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 8 h
PR fusionados (30 d)
91

Descripción

### Description

### Inconsistent behaviour between chip unselection vs. unselecting the chip by setting null value as formControl

When I want to programatically unselect a chip within a formGroup I can not setValue(undefined) only setValue(null).
I find that the behaviour is inconsistent and I understand why the initial value is undefined in case nothing was put onto the component. But after unselection I think it would be more rational to have it set up as null. Or preferably having null always as a default value within formGroup.

- I find this behaviour inconsistent and in case that I need to programatically unselect chipbox, then I need to map the final undefined value to null to have it correctly set in my project

Image

### Reproduction

[StackBlitz link: ](https://stackblitz.com/edit/components-issue-starter-wrxvkjqq?file=src%2Fmain.ts)
Steps to reproduce:
1. Select one of the three chips, for example 'Large'
2. Click on the button set as null
3. This works as expected, and the chips has value null.
4. Try to click on Large again
5. Unselect the selection by clicking on 'Large' again

You receive undefined

Image

Image

### Expected Behavior

Expected behaviour is to have either always undefined or null, or be able to set undefined programatically.
But preferably null over undefined

### Actual Behavior

Inconsistent behaviour between `myControl.setValue(null) ` - which is unselecting chip from the component
And the actual clicking on the selected chip which it makes unselected but automatically set value as undefined

### Environment

- Angular:
- CDK/Material:
- Browser(s):
- Operating System (e.g. Windows, macOS, Ubuntu):

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Comienza con la reproducción enlazada de StackBlitz y compara los valores del control de formulario de chip-listbox después de llamar a setValue(null) y después de hacer clic en el chip seleccionado para deseleccionarlo. Se considera terminado cuando el componente usa de forma coherente el valor null o undefined acordado en ambos recorridos.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
angular, typescript
Área
frontend
Tipo de issue
Error
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
35/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.