angular / angular/components

bug(Chip Input): matChipInputSeparatorKeyCodes won't recognize ";" and doesn't recognize pasted text

Abierto
#21,217 15 comentarios 2 reacciones 0 asignados Ver en GitHub
area: material/chips feature P3
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 8 h
PR fusionados (30 d)
91

Descripción

#### Reproduction

Use StackBlitz to reproduce your issue:
[https://stackblitz.com/edit/angular-cr3nwj?file=src/app/chips-autocomplete-example.ts](https://stackblitz.com/edit/angular-cr3nwj?file=src/app/chips-autocomplete-example.ts)

Steps to reproduce:
1. Using a mat-form-field with mat-chip-list and an input.
2. Declare the [matChipInputSeparatorKeyCodes]="separatorKeysCodes", with separatorKeysCodes: number[] = [ENTER, COMMA, SEMICOLON, 188];
3. Use a ";" in the input to trigger the chipEnd event. But i won't trigger. Neither by pressing the semicolon (EU Keyboard keys: shift + ,")
4. The input wont trigger the chipEnd after pasting text into the input and doesnt check for the separatorKeys in the pasted text.


#### Expected Behavior

The chipEnd event should be triggered after typing the Semicolon into to the input.
Also should pasted text be regnozed and processed based on the declared separatorKeys.
For example:
separatorKeys [COMMA]
Pasted text: "name1, name2, name3"
After pasting chipEnd event triggers and created 3 chips: "name1", "name2", "name3"

#### Actual Behavior
Semicolon doesn't trigger any event and will just display in the input.
Pasted text also doesn't trigger any event and will just display in the input.

#### Environment

- Angular: 11.0.0
- CDK/Material: 11.0.0
- Browser(s): Google Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 10 Pro

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Comienza con el punto de entrada de StackBlitz en src/app/chips-autocomplete-example.ts y el input de mat-chip-list configurado con matChipInputSeparatorKeyCodes. Traza cómo se activa chipEnd para la entrada del teclado y el texto pegado. Se considera terminado cuando la entrada de punto y coma activa chipEnd y el texto pegado separado por comas crea chips independientes.

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
4/5
Tiempo estimado
3-5 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
45/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.