Discussion :

[flo711]

Bonjour,

Je viens demander de l'aide car je suis nouveau sur angular (5) et cela fait déjà pas mal d'heures que je n'arrive pas à résoudre mon problème et mes collègues ne peuvent pas m'aider...

Je dispose d'une Map<string,string> (s'appelant titles) contenant en clefs des identifiants et en valeurs des noms.
Mon but est d'afficher une liste de noms (dans un <mat-form-field>) qui, une fois un sélectionné, enverra une requète en back pour bla bla bla (pas important).
Bref, j'ai découvert les pipes et voilà ce que j'ai fais :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<mat-option *ngFor="let title of titles | sortvalue" [value]="title.key">
{{title.value}}
</mat-option>

cela marche bien, le problème est que les titres sont triés par ordre alphabétiques... de leur clef !
Du coup j'ai voulu créer un pipe moi et voilà ce que j'ai fait :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
import { Pipe, PipeTransform } from '@angular/core';
 
@Pipe({
  name: 'sortvalue'
})
export class SortvaluePipe implements PipeTransform {
 
  transform(mymap: Map<string, string>): string[] {
    return Array.from(mymap.values()).sort();
  }
}

Et là, fatalement cela ne marche pas... J'ai beau chercher je ne comprends pas pourquoi, j'ai une erreur dans mon navigateur : "mymap is undefined".

Si une âme charitable pouvait m'aider, je lui en serai fort reconnaissant !

Merci.

[TIFéç]

Bonjour,

Effectivement, ça semblait plutôt pas mal sous couvert que "titles" soit bien du type "Map<string, string>".

Peut-être que des parenthèses aideraient ?

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

<mat-option *ngFor="let title of (titles | sortvalue)" [value]="title.key"></mat-option>

Le type de return du pipe posera peut-être aussi problème (une fois l'erreur actuelle résolue...) : est ce qu'il ne devrait pas retourner la même "Map<string, string>" ?

En espérant que cela aide... Bon courage