标签索引我需要转到多个字段

时间:2019-07-04 11:11:42

标签: angular

有多个字段。我必须在它们之间进行交叉过渡。我想向您展示3个样品。我应该能够通过制表符对它们之间的转换顺序进行排序

Component.ts

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


@ViewChild("Name") Name: ElementRef;
@ViewChild("SurName") SurName: ElementRef;
@ViewChild("Tel") Tel: ElementRef;


ngAfterViewInit(){
    setTimeout(() => this.Name.nativeElement.focus(), 0);
    setTimeout(() => this.SurName.nativeElement.focus(), 1);
    setTimeout(() => this.Tel.nativeElement.focus(), 2);
 }

HTML文件

<input class="form-control" [(ngModel)]="customer.dsFirstName" autocomplete="off" type="text" maxlength="50" #Name>

<input class="form-control" [(ngModel)]="customer.dsLastName" autocomplete="off" type="text" maxlength="50" #SurName>

<input type="tel" [(ngModel)]="customer.dsPhoneNo" autocomplete="off" class="form-control" prefix="+90 " mask="(000) 000 0000" #Tel>

我尝试过的另一种方法

<input class="form-control" [(ngModel)]="customer.dsFirstName" autocomplete="off" type="text" maxlength="50" (keyup.tab)="ngAfterViewInit()">

<input class="form-control" [(ngModel)]="customer.dsLastName" autocomplete="off" type="text" maxlength="50" (keyup.tab)="ngAfterViewInit()">

<input type="tel" [(ngModel)]="customer.dsPhoneNo" autocomplete="off" class="form-control" prefix="+90 " mask="(000) 000 0000" (keyup.tab)="ngAfterViewInit()">

0 个答案:

没有答案