Ionic：自动对焦文本字段

Question

我知道这个问题已经被问过很多次了，但我找不到我的解决方案：

我正在尝试在页面加载时自动聚焦文本字段，如下所示：

Html:

<input type="text" #autofocusfield>

TS 文件

相关导入

import { Component,ViewChild } from '@angular/core';

自动对焦代码：

export class Tab1Page {
  @ViewChild('autofocusfield') inputtext; 

ionViewDidLoad() {         
    setTimeout(() => {
      this.inputtext.setFocus();
    }, 500);
  }

我也尝试过使用 autofocus='true' 但是那没有用，有人可以指导我如何实现这个

Answer 1

这就是您所需要的。此 stackblitz link

中的演示

@ViewChild("autoFocus") private af: ElementRef;
constructor(public navCtrl: NavController) {}
ngAfterViewChecked() {
  this.af.nativeElement.focus();
}

你只需要在 ngAfterViewChecked() 钩子中设置 focus() 方法。

HTML 的模板是..

<input #autoFocus type="text" >

Ionic：自动对焦文本字段

Ionic : Autofocus a text field

ionic-framework

ionic2

angular