Loading

Quipoin Menu

Learn • Practice • Grow

angular / Custom Pipes
interview

Q1. How do you create a custom pipe in Angular?
Create a class implementing PipeTransform and decorate with @Pipe. Example custom pipe that reverses a string:
@Pipe({ name: ''reverse'' }) export class ReversePipe implements PipeTransform { transform(value: string): string { return value.split('''').reverse().join(''''); } }
Then use it in templates: {{ ''hello'' | reverse }}.

Q2. How do you pass parameters to a custom pipe?
Add parameters to the transform method. Example pipe that truncates text:
transform(value: string, limit: number = 10): string { return value.length > limit ? value.substring(0, limit) + ''...'' : value; }
Usage: {{ longText | truncate:20 }}.

Q3. Where should custom pipes be declared?
Custom pipes must be declared in an NgModule, just like components. Add them to the declarations array of the module where they''ll be used. If the pipe is used across multiple modules, consider creating a shared module that declares and exports the pipe.

Q4. What is the difference between a pipe and a function in a component?
Pipes are more efficient for repeated use because they are memoized (pure pipes) and only recalculated when inputs change. Component functions are called on every change detection, which can hurt performance. Pipes also promote reusability across templates.

Q5. Can a pipe be stateful?
Yes, you can create impure pipes (pure: false) that maintain state. However, this is discouraged because they are called frequently and can cause performance issues. Stateful pipes should be used sparingly and with caution.