diff --git a/apps/angular/9-wrap-function-pipe/src/app/app.component.ts b/apps/angular/9-wrap-function-pipe/src/app/app.component.ts
index af8b6ff73..42c3c289c 100644
--- a/apps/angular/9-wrap-function-pipe/src/app/app.component.ts
+++ b/apps/angular/9-wrap-function-pipe/src/app/app.component.ts
@@ -1,13 +1,15 @@
 import { Component } from '@angular/core';
+import { WrapFunctionPipe } from '../pipes/wrapFunction-pipe';
 
 @Component({
   selector: 'app-root',
   template: `
     @for (person of persons; track person.name) {
-      {{ showName(person.name, $index) }}
-      {{ isAllowed(person.age, $first) }}
+      {{ showName | wrapFn: person.name : $index }}
+      {{ isAllowed | wrapFn: person.age : $first }}
     }
   `,
+  imports: [WrapFunctionPipe],
 })
 export class AppComponent {
   persons = [
diff --git a/apps/angular/9-wrap-function-pipe/src/pipes/wrapFunction-pipe.ts b/apps/angular/9-wrap-function-pipe/src/pipes/wrapFunction-pipe.ts
new file mode 100644
index 000000000..73f6f4395
--- /dev/null
+++ b/apps/angular/9-wrap-function-pipe/src/pipes/wrapFunction-pipe.ts
@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'wrapFn',
+})
+export class WrapFunctionPipe implements PipeTransform {
+  transform<T extends (...args: any) => any>(
+    fn: T,
+    ...args: Parameters<T>
+  ): ReturnType<T> {
+    return fn(...args);
+  }
+}