angular / angular/components

mat-selection-list list-options is not updated when formControl for mat-selection-list is updated with setValue

Aperta
#15,477 3 commenti 10 reazioni 0 assegnatari Vedi su GitHub
area: material/list P3
Lingua principale
TypeScript
Stelle
25k
Fork
6.8k
Merge medio
1g 8h
PR unite (30g)
91

Descrizione

#### What is the expected behavior?
Checkboxes should update

#### What is the current behavior?
Checkboxes do not update.

#### What are the steps to reproduce?
**editor.componenet.html**
```html

{{ role.attributes.name }}

```

**editor.component.ts (onInit)**
```javascript
this.form = this.fb.group({
role: [[...this.user.attributes.role], Validators.required],
});
```

`this.user.attributes.role` is an array of string.

**I tried**
**editor.component.ts**
```javascript
ngAfterContentInit() {
this.form.patchValue({
'role': [...this.user.attributes.role]
});
}
```

**I also tried**
**editor.component.ts**
```javascript
ngAfterContentInit() {
setTimeout(() => {
this.form.patchValue({
'role': [...this.user.attributes.role]
});
console.log(this.form.value.role);
}, 1000);
}
```

Note that I'm getting `roles` with an observable :
**editor.component.ts**
```javascript
combineLatest(
// Others observables ...
this.jsonApi.all('roles').pipe(map(document => document.data)),
).subscribe(([firms, langs, roles]) => {
// Others observables ...
this.roles = roles;
});
```

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular 7.x.x
Material 7.x.x

#### Is there anything else we should know?
I know there's a [ticket](https://github.com/angular/material2/issues/9085) about this, but it's closed and no one replies

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Riproduci il problema usando editor.component.html e editor.component.ts con una Angular 7 mat-selection-list, ruoli asincroni e formControl setValue o patchValue. Inizia tracciando la propagazione dei valori di mat-selection-list e mat-list-option; il lavoro è completato quando le caselle di controllo riflettono l'array di stringhe aggiornato dopo l'aggiornamento del form.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
angular, typescript
Ambito
frontend
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.