0

I have the following setup of interfaces and types:

export interface MyEventMap extends ElementEventMap {
  'loaded': Event
}

export type MyEventsTypes = {
  [key in keyof (HTMLElementEventMap & MyEventMap)]?: (e: Event) => void
}

export interface ObectInterface {
  events?: MyEventsTypes
}

When I try and use the ObjectInterface, within the loaded function I get this error:

Property 'textContent' does not exist on type 'MyEventsTypes'.

How can I make it so that typescript knows that this is bound to an HTMLElement and not MyEventsTypes? When I compile my code, and loaded runs, this.textContent works just fine, and displays the text.

<ObjectInterface>{
  events: {
    loaded() {
      console.log(this.textContent)
    }
  }
}
Get Off My Lawn
  • 34,175
  • 38
  • 176
  • 338
  • Possible duplicate of [Type annotation for \`this\` keyword in Typescript](https://stackoverflow.com/questions/45242125/type-annotation-for-this-keyword-in-typescript) or [Declaring the type of 'this' in a typescript function?](https://stackoverflow.com/q/28920753) – Heretic Monkey Aug 30 '18 at 18:29
  • 1
    change `(e: Event) => void` to `(this: HTMLElement, e: Event) => void` ? – jcalz Aug 30 '18 at 19:09

0 Answers0