Question

在我的代码片段中，我尝试为第一个输入文本字段设置焦点。但是当页面加载时，它会聚焦并突然失去焦点。关闭键盘。任何人都可以告诉我实现这一点。

<ion-input [(ngModel)]="username" name="username" type="text" #username="ngModel" spellcheck="false" autocapitalize="off" autofocus clearInput required></ion-input>

Answer 1

使用（＃）添加视图参考在你的html中，

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

@ViewChild('focusInput') myInput;

ionViewDidEnter() {
       this.myInput.setFocus();
    }

在component.ts中导入ViewChild并设置此焦点（#focusInput）输入

喜欢

{{1}}

这会有所帮助。

Answer 2

<input #exampleInput />

@ViewChild('exampleInput') exampleInput: ElementRef;

setTimeout(() => {
    this.exampleInput.nativeElement.focus();
}, 300);

这适合我。

注意：您可能希望在ngAfterViewInit方法或其他地方使用此超时，300毫秒在我测试的设备中延迟声音。

无法将输入字段聚焦在ionic2

2 个答案: