Angular Pipes — Interview Quick Revision

1. What is a pipe in Angular?

A pipe transforms data for display in an Angular template without changing the original value.
{{ name | uppercase }}

2. What are built-in pipes?

Angular provides built-in pipes such as DatePipe, CurrencyPipe, DecimalPipe, PercentPipe, UpperCasePipe, LowerCasePipe, JsonPipe, and AsyncPipe.
{{ price | currency }}

3. How do you use DatePipe?

DatePipe formats date values into a required date format.
{{ createdDate | date:'dd/MM/yyyy' }}

4. How do you use CurrencyPipe?

CurrencyPipe formats a number as a currency value with the specified currency code.
{{ price | currency:'INR' }}

5. What is AsyncPipe?

AsyncPipe subscribes to an Observable or Promise, displays its latest value, and automatically handles subscription cleanup.
{{ user$ | async }}

6. How do you create a custom pipe?

Create a class with @Pipe and implement PipeTransform with the transform() method.
Pipe({ name: 'shortName' }) export class ShortNamePipe implements PipeTransform { ... }

7. What is the difference between pure and impure pipes?

Pure pipe: runs when its input value/reference changes and is the default.
Impure pipe: can run frequently during change detection using pure: false, so it may affect performance.

8. How are pipes imported into standalone components?

Standalone components import the required pipe directly in their imports array.
@Component({ imports: [DatePipe, CurrencyPipe] })

9. How were pipes declared and imported using NgModules?

Custom pipes were added to an NgModule's declarations; built-in pipes came through modules such as CommonModule.
@NgModule({ declarations: [MyPipe], imports: [CommonModule] })