DazSanchez

// Typescript

type Predicate<T> = (v: T) => boolean;
type Mapper<T, V> = (item: T) => V;

export const createFilterMap = <T, V>(predicate: Predicate<T>, map: Mapper<T, V>) => {
  return (values: T[]): V[] => {
    return values.reduce((reduced, nextValue) => {
      if (predicate(nextValue)) {
        return reduced.concat(map(nextValue));

DazSanchez

types = {
  [TYPES_PRODUCT.COACHING]: 'tv',
  [TYPES_PRODUCT.CONSULTING]: 'question_answer',
  [TYPES_PRODUCT.CONFERENCE]: 'mic'
}

// ...

transform(type: string) {
  return types[type];

DazSanchez

DazSanchez

<div class="main">
  <div class="item" (inViewport)="startCounters()">
    <p counter [to]="10000" [duration]="10">0</p>
    <p counter [to]="100" [duration]="20">0</p>
    <p counter [to]="19" [duration]="30">0</p>
    <p counter [to]="10" [duration]="15">0</p>
  </div>
</div>

DazSanchez

import { Directive, ElementRef, Output, EventEmitter, OnDestroy } from "@angular/core";
import { fromEvent, Subscription } from "rxjs";
import { filter } from "rxjs/operators";

@Directive({ selector: "[inViewport]" })
export class InViewportDirective implements OnDestroy {
  @Output("inViewport") inViewport = new EventEmitter();

  private subscription: Subscription;

DazSanchez

import { Directive, ElementRef, EventEmitter, Input, OnInit, Output } from "@angular/core";
import CountUp from "countup.js";

@Directive({ 
  selector: "[counter]", 
  exportAs: "countUp"
})
export class CounterDirective implements OnInit {
  @Input() from: number = 0;
  @Input() to: number;