Angular: pipe any function in your template

arbitrary-piped-function.pipe.ts

/**
 * Pipe that let's you pipe just anything! Function calls in your templates are normally a bad idea, performance wise.
 * However you can get around this problem by writing pipes that don't trigger on every CD cycle but only when the arguments change.
 * Doing this for every function you want can be painful however! Here comes arbitraryPipedFunction for the rescue!
 * Just pass the function, the arguments, the context and some extra arguments you may want to include in the watches arguments for the
 * pipes internal CD. There you go. One pipe to rule them all.
 */
@Pipe({
  name: 'arbitraryPipedFunction'
})
export class ArbitraryPipedFunctionPipe implements PipeTransform {

  /**
   * Pipes anything!
   * Call it in your template like so:
   * ```html
   * <div>{{myFunction | arbitraryPipedFunction : this : [42,'sinus'] : watchMe, watchMeToo}}</div>
   * ```
   * @param functionToPipe function that should get piped.
   * @param context This context of the called function.
   * @param args Arguments to pass to functionToPipe.
   * @param changeDetectionArgs Arbitrary number of extra arguments to watch for changes (changes to them will trigger the pipe)
   * computation.
   */
  transform(functionToPipe: (...args) => any, context, args: any[] = [], ...changeDetectionArgs: any[]): any {
    return functionToPipe.bind(context)(...args);
  }

}