角度または角度2でない角度でオートフォーカスを設定する方法

Question

anglejsの入力フィールドにオートフォーカスを設定する方法については、ディレクティブまたはHTMLオートフォーカスを作成する方法に関する記事が多数あります。角度2、角度4など）のHTMLコンポーネントコード内の参照を取得するために#nameitを追加で

Answer 1

。

<input type="text" name="me" #nameit> 

次に、自動彩度を適用します。

@ViewChild('nameit') private elementRef: ElementRef; 

    public ngAfterViewInit(): void { 
    this.elementRef.nativeElement.focus(); 
    } 

Answer 2

<input type="text" #textInput placeholder="something" (focus)="someFunction(textInput.value)"/> 

又は

<input type="text" #textInput placeholder="something" (keyup.enter)="someMethod(textInput.value)"/> 

Answer 3

Aniruddha Dasの答えがうまくいく場合もあります。これは必要な検証とテンプレートベースのフォームに適用された場合は、次のエラーを取得することがあります。これに

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after >it was checked. Previous value: 'false'. Current value: 'true'.

一つの解決策はngInit（内フォーカス（）の呼び出しをラップしている

）の代わりにngAfterViewInitの（） 。だから、Aniduddhaの回答時に拡張：

をあなたのHTML内のコンポーネントに#namedReferenceを追加します。

<input type="text" 
    placeholder="Your full name" 
    name="name" 
    ngModel 
    #fullName="ngModel" 
    required 
    #nameit> 

は、その後にオートフォーカスを適用するには（）をonNgInit使用：

@ViewChild('nameit') private elementRef: ElementRef; 

ngOnInit() { 
    this.elementRef.nativeElement.focus(); 
} 

Answer 4

することができます最も有益な回答の例を使用してください。しかし、時には、あなたは "非同期"呼び出しを行うためにsetTimeoutの中にフォーカスを置く必要があります。私の場合、私は角度材料のマットオートコンプリートコンポーネントの選択されたフィルタにsetTimeoutを置く必要があります。この

setTimeout(() => this.qtdeRef.nativeElement.focus());