Now i know there are plenty of answers for this, trust me i am actually trying to figure it out but i can't get this feature to work on my app. I hope this question will not be defined as duplicate.

My question is how do i give focus to the last element of a ngFor when pressing a button?

I have a *ngFor that i use to loop through some FormArray like this:

<tr *ngFor="let reg of registrations.controls; let i = index" [formGroupName]="i">
  <td>
       <ng-select #peopleSelect [selectOnTab]="true" appendTo="body" placeholder="Select Operator" 
        formControlName="peopleId" style="width: 250px">
         <ng-option *ngFor="let people of peopleList" [value]="people.peopleId">Name Surname</ng-option>
        </ng-select>
 </td>
</tr>

Here:

• registrations is a getter that gets a FormArray and i loop through it's controls
• ng-select is a select element

  Don't know if this could help but i am trying to do all this inside a bootstrap modal... that i open from the parent component

  CodePudding user response：

  Try like this

  import { NgSelectComponent } from '@ng-select/ng-select';
  
  @ViewChildren('select') peopleSelectEl!: QueryList<NgSelectComponent>;
  
  ngAfterViewInit() {
     this.peopleSelectEl.last.focus();
  }
  

  working example is here