Class AppComponent

examples/angular/injectHeldKeys/src/app/app.component.ts:14–40

  styleUrl: './app.component.css',
})
export class AppComponent {
  heldKeys = injectHeldKeys()
  heldCodes = injectHeldKeyCodes()
  history = signal<string[]>([])
  readonly formatForDisplay = formatForDisplay

  constructor() {
    effect(() => {
      const keys = this.heldKeys()
      if (keys.length > 0) {
        const combo = keys
          .map((k) => formatForDisplay(k, { useSymbols: true }))
          .join(' + ')
        this.history.update((h) => {
          if (h[h.length - 1] !== combo) {
            return [...h.slice(-9), combo]
          }
          return h
        })
      }
    })
  }

  clearHistory(): void {
    this.history.set([])
  }
}