shrimpdrake shrimpdrake - 3 months ago 10
TypeScript Question

Can't use .filter() nor for on an array of objects in my pipe

I have an issue with a custom pipe I am creating. My Persos is an array of Perso objects and it seems like I can't apply .filer() so I tried a simple for loop ( which works fine in a *ngFor on such Persos var ) with no success either. I think I am missing something very basic here about handling objects in Typescript.

Here is the pipe code with some tests and comments:

import { Pipe, PipeTransform } from '@angular/core';

import { Perso } from './perso';

@Pipe({ name: 'startsWithPersoPipe' })
export class StartsWithPersoPipe implements PipeTransform {
transform(Persos: Perso[]){

// this for makes it all bug, when I comment it my pipe works fine
for( let perso of Persos){
}

// this for does not make it crash but does not behave at all like I want
for( let perso in Persos){
console.log(perso); // just prints 0, 1, 2, 3 etc up to 109 ( i have 110 elements in the Perso[] var I use for test)
console.debug(perso); // same behavior as console.log(perso)
console.log(perso.nom); // undefined
}
console.debug(Persos); // Array [ Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 100 moreā€¦ ]
// when I click on on of the Object I get one of my objects with correct values in nom, description and type : it's all fine !
return Persos;
}
}


Here is perso.ts

export class Perso {
nom: string;
type: string;
description: string;
}


Any help, hint or link to useful resource that help me solve this is much appreciated.

Answer

This should do:

@Pipe({ name: 'startsWithPersoPipe' })
export class StartsWithPersoPipe implements PipeTransform {
  transform(Persos: Perso[]){
    if(Persos == null) {
      return null;
    }

    return persos.filter(p => p.nom && p.nom.startsWith('super'));
  }
}