Question

我希望能够集中任何属于我的FormGroup的HTML控件（输入，选择或textaera）。

基本上我需要Angular2相当于：

document.getElementById('email').focus();

以下是我的FormGroup的示例：

this.contactForm = this.formBuilder.group({
  email: ['', [Validators.required, this.validEmail]],
  message: ['', Validators.required]
});

这是相关的HTML：

<form[formGroup]="contactForm" (ngSubmit)="submitContactForm()" novalidate>
  <ion-item>
    <ion-label>E-mail</ion-label>
  </ion-item>
    <ion-input type="email" [(ngModel)]="contactForm.email" formControlName="email"></ion-input>
  <ng-container *ngIf="contactForm.controls['email'].touched">
    <div *ngIf="contactForm.controls['email'].hasError('required')" class="form-error-message">Veuillez saisir votre adresse e-mail.</div>
    <div *ngIf="!contactForm.controls['email'].hasError('required') && contactForm.controls['email'].hasError('validEmail')" class="form-error-message">L'adresse e-mail saisie est invalide.</div>
  </ng-container>
  <ion-item>
    <ion-label>Détail</ion-label>
    <ion-textarea [(ngModel)]="contactForm.message" formControlName="message"></ion-textarea>
  </ion-item>
  <ng-container *ngIf="contactForm.controls['message'].touched">
    <div *ngIf="contactForm.controls['message'].hasError('required')" class="form-error-message">Veuillez saisir une description du problème.</div>
  </ng-container>
</form>

这很好但我希望能够从我的组件类中集中任何一个输入。

我对需要在模板中单击按钮的解决方案不感兴趣，我真的需要一种方法来关注我表单中存在的任意控件。

如何以编程方式将焦点放在FormGroup控件上

0 个答案: