问如何在选择时使用formArray索引加载动态下拉数据

EN

<form [formGroup]='formName'>
              <div formArrayName="controllerArray" class="ui-g ui-g-12 ui-g-nopad " >
                <div  class="ui-g  ui-g-12 ui-g-nopad " *ngFor="let item of formName.controls.controllerArray.controls; let i=index" [formGroupName]="i">  
                  <div class="ui-md-4">                   
                    <label class="mandatory"
                  >{{ labels["STATE_OF_INCORPORATION_FILE_NUMBER"] }}
                  <span class="colon"></span>
                </label>           

                <select formControlName="select1" class="ui-inputtext" [(ngModel)]="item.controls.select1.value" (change)="changeAction($event,i)"> 
                  <option>--Select--</option>
                  <option *ngFor="let c of countryOptions" [value]="c.value">{{c.label}}</option>
                 
                </select>
              </div>
              <div class="ui-md-4">
                <label class="lbl-hidden"> State </label>
                <select formControlName="select2" class="ui-inputtext" [(ngModel)]="item.controls.select2.value"> 
                  <option>--Select--</option>
                  <option *ngFor="let b of businessStateOptions" [value]="b.value">{{b.label}}</option>
                 
                </select>
              </div>
              <div class="ui-md-3">
                <label class="lbl-hidden"> comments  </label>
                <input
                  type="text"
                  pInputText
                  class="form-control"
                  formControlName="input"    
                />
                </div>
                <div class="ui-md-1">
                  <label class="lbl-hidden"> State </label>
                  <br/>
                  <button (click)='removeInput(i)'  style="min-width: auto;"  pButton icon="fa fa-minus"></button>
                </div>
                </div>
              </div>
            </form>
            
            <button class="add-remove-btn" pButton (click)='addInput()' icon="fa fa-plus"></button>` 

import { Component, OnInit, ViewChild } from '@angular/core'
import { FormBuilder, Validators, FormArray } from '@angular/forms';

export class EntityEditComponent implements OnInit {
public countryOptions = [];

formName =this.fb.group({
    controllerArray: this.fb.array([])
  })  

ngOnInit() {    
 this.countryOptions = [{"label":"United States","value":"US"},{"label":"Canada","value":"CA"}]
}

 changeAction(e, index) { 
  if(index == 1 ) {     // Here I'm trying to change the data if country is selected CA
 let businessStateOptions = []
businessStateOptions= [{label:"Alberta",value:"CA"}]

const controlArray = <FormArray> this.formName.get('controllerArray');
    controlArray.controls[index].get('select2').setValue( businessStateOptions);
    }  
}



addInput() {(this.formName.get('controllerArray') as FormArray).push(this.fb.group({select1:'', select2:'',input:''})) }

removeInput(index) { this.formName.controls.controllerArray["controls"].splice(index,1) }

}