0
votes

Comment utiliser les options SORT?

Je prends des données de ngrx-store

// descending
this.getData$.sort((a, b) => b.id - a.id); 

//ascending
this.getData$.sort((a, b) => a.id - b.id);

Et en HTML j'utilise ceci dans *ngFor

<div *ngFor="let data of getData$ | async">
  <div>{{data.name}}</div>
</div>

Je veux commander par ceci par ID directement dans le composant car orderBy PIPE directement dans la vue n'est pas une recommandation.

J'essaye mais j'obtiens l'erreur La propriété 'sort' n'existe pas sur le type

getData$: Observable<IGetData>;

this.getData$ = this.store.select(
      fromStore.dataSelector.getNewData,
    );

// array example [
{id: number, name: string, btn: number, index: number},
{id: number, name: string, btn: number, index: number},
{id: number, name: string, btn: number, index: number}
]

Comment l'utiliser case SORT options?

Thnx


0 commentaires

3 Réponses :


1
votes

Je n'utilise pas angulaire, donc je ne suis pas sûr de la réponse. Mais il semble que vos données ne soient pas un tableau. J'ai eu un problème similaire avec certaines données de MongoDB où même c'était un tableau, il était passé en tant qu'objet. Vous pouvez essayer d'encapsuler les données dans Array.from () comme Array.from (this.getData $). Sort ((a, b) => a.id - b.id) < / code>

Vous pouvez également vérifier le type de données pour vous assurer qu'il s'agit d'un tableau. console.log ((typeof ((a, b) => a.id - b.id))


1 commentaires

Thnx, je vais essayer



1
votes

Jetez un oeil à ce NGRX Effets . Puisque votre getdata $ code> est un observable code> et non un tableau code> Vous pouvez essayer quelque chose comme ceci:

this.getData$ = this.getData$
  .pipe(
     map((data) => data.sort((a,b) => a.id - b.id))
  );


1 commentaires

Thnx, je vais essayer



1
votes

Je ne sais pas où avez-vous vu que PIPE n'est pas recommandé. Mais dans votre cas, vous pouvez: Utiliser un tube angulaire, ou modifier votre Observable comme ceci:

this.getData$ = this.store.pipe(
  select(fromStore.dataSelector.getNewData),
  map(data => [...data].sort((a, b) => b.id - a.id)),
);

sort modifier le tableau, vous devriez donc faire une copie de avec [...data


2 commentaires

Salut, je vais essayer. Voici des informations sur orderBy et Sort PIPE ... Je n'ai pris que ce type de PIPE, pas un autre .... angular.io/guide/pipes#appendix-no-filterpipe-or-‌ orderbypipe


OK, ce qu'ils ont dit, c'est qu'ils ne fournissent pas de tube générique utilisant le nom de propriété comme variable, ce qui est mauvais. Vous pouvez utiliser une pipe pure sans aucun problème de performance / minification.