From 67504d9160e5e7911f3f40d510e60b776392c2d4 Mon Sep 17 00:00:00 2001 From: jpaberzs Date: Wed, 26 Aug 2026 14:15:58 +0300 Subject: [PATCH] feat: refactor pipes --- apps/angular/8-pure-pipe/src/app/app.component.ts | 11 ++++------- apps/angular/8-pure-pipe/src/app/simple-pipe.pipe.ts | 10 ++++++++++ 2 files changed, 14 insertions(+), 7 deletions(-) create mode 100644 apps/angular/8-pure-pipe/src/app/simple-pipe.pipe.ts diff --git a/apps/angular/8-pure-pipe/src/app/app.component.ts b/apps/angular/8-pure-pipe/src/app/app.component.ts index a1164df21..0397b3cb1 100644 --- a/apps/angular/8-pure-pipe/src/app/app.component.ts +++ b/apps/angular/8-pure-pipe/src/app/app.component.ts @@ -1,19 +1,16 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; +import { SimplePipe } from './simple-pipe.pipe'; @Component({ selector: 'app-root', changeDetection: ChangeDetectionStrategy.Eager, + imports: [SimplePipe], template: ` @for (person of persons; track person) { - {{ heavyComputation(person, $index) }} + {{ person | simplePipe: $index }} } `, }) export class AppComponent { - persons = ['toto', 'jack']; - - heavyComputation(name: string, index: number) { - // very heavy computation - return `${name} - ${index}`; - } + public persons: string[] = ['toto', 'jack']; } diff --git a/apps/angular/8-pure-pipe/src/app/simple-pipe.pipe.ts b/apps/angular/8-pure-pipe/src/app/simple-pipe.pipe.ts new file mode 100644 index 000000000..542bd4fac --- /dev/null +++ b/apps/angular/8-pure-pipe/src/app/simple-pipe.pipe.ts @@ -0,0 +1,10 @@ +import { Pipe, PipeTransform } from '@angular/core'; + +@Pipe({ + name: 'simplePipe', +}) +export class SimplePipe implements PipeTransform { + transform(name: string, index: number): string { + return `${name} - ${index}`; + } +}