shrimpdrake shrimpdrake - 1 year ago 104
TypeScript Question

Error using built-in pipe in my custom pipe

Build-in pipes are working fine in my components but it doesn't 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

Answer Source
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) {}


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() 
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download