CODEWITHSUNDEEP
angulartypescriptangular-pipe
shrimpdrake
shrimpdrake

Reputation: 1576

Error using built-in pipe in my custom pipe

Built-in pipes are working fine in my components, but not in my custom pipe. Apart from this my pipe is working just fine. I can't see what could be the problem since I imported Pipe.

Here is the code with the erros:

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

@Pipe({ name: 'startsWithPersoPipe' })
export class StartsWithPersoPipe implements PipeTransform {
  transform(Persos: Perso[], search:string){
    // without this if will crash as Persos is null until it gets its data from server
    if(Persos == null) {
      return null;
    }
    for(let perso of Persos){
      console.log(perso.nom); // works fine
      console.log(perso.nom | lowercase); // ORIGINAL EXCEPTION: ReferenceError: lowercase is not defined
    }
    return Persos.filter(p => (p.nom) && (p.nom).startsWith(search)); // works fine
  }
}

Upvotes: 1

Views: 257

Answers (1)

Günter Zöchbauer
Günter Zöchbauer

Reputation: 658067

console.log(perso.nom | lowercase);

Is not supposed to work. 

| somePipe

is only supported in templates in binding expressions.

You can use pipes in code like

constructor(private lowercase: LowerCasePipe) {}

console.log(this.lowercase.transform(perso.nom));

You also don't import LowerCasePipe

Instead of using the pipe you can also just call the method on the string

perso.nom && perso.nom.toLowerCase()

Upvotes: 2

Related Questions