Cible d'événement non prise en charge

Angular ne reconnaît que trois chaînes comme cibles d'événements globaux : 'window', 'document' et 'body'. Si vous passez une autre chaîne comme cible lors de l'enregistrement d'un event listener global, Angular ne peut pas la résoudre et lève cette erreur.

Déboguer l'erreur

Vérifiez qu'il n'y a pas de faute de frappe dans le nom de la cible utilisé avec @HostListener ou Renderer2.listen(). Une petite erreur comme 'windw' au lieu de 'window' suffit à la déclencher :

@Component({
  selector: 'app-example',
  template: '<button>Click me</button>',
})
export class Example {
  @HostListener('windw:resize') // typo — should be 'window'
  onResize() {}
}

Il en va de même lorsque vous appelez directement Renderer2.listen() avec une chaîne qu'Angular ne connaît pas :

this.renderer.listen('global', 'click', handler); // 'global' is not supported

Corriger l'erreur

Corrigez la cible pour utiliser l'une des trois chaînes prises en charge, ou passez un véritable élément DOM au lieu d'une chaîne :

@Component({
  selector: 'app-example',
  template: '<button>Click me</button>',
})
export class Example {
  @HostListener('window:resize')
  onResize() {}
}

// Use an element reference when you need to target something more specific
this.renderer.listen(this.elementRef.nativeElement, 'click', handler);