[英]How to focus on PrimeNG p-button
I have a form in Angular. On pressing Enter key I would like to focus on the next control.我在 Angular 中有一个表格。按下 Enter 键后,我想专注于下一个控件。 On
keyup.enter
event for each input I use the ref of the next input and call focus()
.在每个输入的
keyup.enter
事件上,我使用下一个输入的 ref 并调用focus()
。 But this isn't working for p-button
.但这不适用于
p-button
。
<div class="p-field p-col-12 p-md-6">
<label>Address Line 1</label>
<input #regAddressLine1 type="text" pInputText [readonly]="!editMode" formControlName="regAddressLine1" (keyup.enter)="regAddressLine2.focus()">
<small class="p-invalid" *ngIf="f.regAddressLine1.invalid && f.regAddressLine1.touched">Required</small>
</div>
<div class="p-field p-col-12 p-md-6">
<label>Address Line 2</label>
<input #regAddressLine2 type="text" pInputText [readonly]="!editMode" formControlName="regAddressLine2" (keyup.enter)="save.focus()">
<small class="p-invalid" *ngIf="f.regAddressLine2.invalid && f.regAddressLine2.touched">Required</small>
</div>
<div class="p-col-12 p-md-3">
<p-button #save label="Save" styleClass="p-button-primary">
</p-button>
</div>
Looks like p-button
component doesn't have such method.看起来
p-button
组件没有这样的方法。
I would consider using attribute version of primeng button:我会考虑使用 primeng 按钮的属性版本:
<button #save pButton label="Save" styleClass="p-button-primary" type="button"></button>
^^^^^^^^
This way #save
template variable is referring to native HTMLButtonElement which has focus()
method.这样
#save
模板变量是指具有focus()
方法的本机 HTMLButtonElement。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.