web-dev-qa-db-ja.com

Angular 2ネイティブDOM要素のonloadイベント

私の最終的な目標は、作成時にtextarea要素をオート​​フォーカスすることです。イベントonloadでe.target.focus()を呼び出す解決策を考えました。何かのようなもの：

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

その後：

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

問題はangularがloadイベントを認識しないことです。

PS：autofocusを1回試しましたが、機能していないようです。

javascripthtmlangular
19
Pho Huynh

あなたはngAfterViewInitフックでそれを行うことができるはずです：

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

// ...

export class Component implements AfterViewInit {

  @ViewChild('textarea') textarea: ElementRef

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

テンプレート変数を設定する必要があるテンプレートの場所：

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

HTML5 autofocus属性 を試してください：

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

JavaScriptで実行するよりも、可能であればネイティブDOM APIを使用する方が常に優れています（そしてはるかに簡単です！）。

編集：上記は間違っています。以下の my comment を参照してください。

9
jessepinho