Événement onload d'Angular 2 pour un élément DOM natif

Question

Mon but ultime est de faire en sorte qu'un élément textarea soit mis au point automatiquement lors de sa création. Je viens de trouver une solution pour appeler e.target.focus() sur l'événement onload . Quelque chose comme :

<textarea rows="8" col="60" (load)='handleLoad($event)'>

et ensuite :

handleLoad(e){
  e.target.focus();
}

Le problème est qu'angular ne reconnaît pas load événement.

PS : J'ai essayé autofocus une fois, mais cela ne semble pas fonctionner.

Answer 1

Vous devriez pouvoir le faire dans le crochet ngAfterViewInit :

import { ViewChild, ElementRef, AfterViewInit } from '@angular/core'

// ...

export class Component implements AfterViewInit {

  @ViewChild('textarea') textarea: ElementRef

  ngAfterViewInit() {
    this.textarea.nativeElement.focus()
  }
}

Dans le modèle, vous devez définir une variable de modèle :

<textarea #textarea rows="8" col="60"></textarea>

Answer 2

Essayer le code HTML5 autofocus attribut :

<textarea rows="8" col="60" autofocus>

Il est toujours préférable (et beaucoup plus simple !) d'utiliser l'API DOM native si possible que de le faire en JavaScript :)

EDIT : Ce qui précède est incorrect. Voir mon commentaire ci-dessous.