access Class variable from within a function

Question

I have the following code:

import { Component, OnInit } from '@angular/core';

import keypress from 'keypress.js';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
  debug: boolean = true;
  tenInchScreen: Boolean = false;

  constructor() {
    var listener = new keypress.Listener();
    listener.register_many([{ // 1 key
      "keys": "f1",
      "prevent_default": true,
      "on_keyup": function () {
        if (this.debug) {
          console.debug("F1 key pressed");
        }
      },
    },
  ]);

   }

  ngOnInit() {
  }

}

I would like the "on_keyup" function to be able to access the debug variable in the HomeComponent class. When I hit "F1" on my keyboard, the console gives me this error:

ERROR TypeError: Cannot read property 'debug' of undefined

How do I access debug from that function?