我正在 Angular2(Beta 8)中开发一个组件。该组件有一个文本框和一个下拉列表。我想在组件加载或下拉列表更改事件后立即将焦点设置在文本框中。我如何在 Angular2 中实现这一点?以下是该组件的 Html。
<div>
<form role="form" class="form-horizontal ">
<div [ngClass]="{showElement:IsEditMode, hidden:!IsEditMode}">
<div class="form-group">
<label class="control-label col-md-1 col-sm-1" for="name">Name</label>
<div class="col-md-7 col-sm-7">
<input id="name" type="text" [(ngModel)]="person.Name" class="form-control" />
</div>
<div class="col-md-2 col-sm-2">
<input type="button" value="Add" (click)="AddPerson()" class="btn btn-primary" />
</div>
</div>
</div>
<div [ngClass]="{showElement:!IsEditMode, hidden:IsEditMode}">
<div class="form-group">
<label class="control-label col-md-1 col-sm-1" for="name">Person</label>
<div class="col-md-7 col-sm-7">
<select [(ngModel)]="SelectedPerson.Id" (change)="PersonSelected($event.target.value)" class="form-control">
<option *ngFor="#item of PeopleList" value="{{item.Id}}">{{item.Name}}</option>
</select>
</div>
</div>
</div>
</form>
</div>
使用简单autofocus
HTML5 属性适用于“加载时”场景
<input autofocus placeholder="enter text" [(ngModel)]="test">
or
<button autofocus (click)="submit()">Submit</button>
http://www.w3schools.com/TAgs/att_input_autofocus.asp http://www.w3schools.com/TAgs/att_input_autofocus.asp
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)