Angular - Reactive Forms - FormControl value is same for different drop-down

I am using reactive forms in angular.

I follow this answer of question How to use array of objects for controls in Reactive Forms

And This is my object

"destination" :
{
 "techDestinationSection" : 
 [
    {
        "id": 119,
        "siteDestinationSections": [
            {
                "id": 17,
                "siteCodeId": 2,
                "description": "<p> new des </p>",
                "images": [],
                "links": []
            },
            {
                "id": 18,
                "siteCodeId": 1,
                "images": [ ],
                "links": []
            },
            {
                "id": 19,
                "siteCodeId": 3,
                "images": [],
                "links": [
                    "adgh"
                ]
            }
        ]
    }
 ]
}

.service file

 this.form = this.fb.group({
     techDestinationSection: this.fb.array([]),
 });

.component.ts file

get destinationForm() {
    return this.destinationService.form;
  }
 get techDestinationSection() {
    return this.destinationForm.get('techDestinationSection') as FormArray;
  }

// fetching data 
OnFetch {

 // removed some code
// destination is  patch value
const sections = this.techDestinationSection;
sections.clear();

destination?.techDestinationSection.forEach((item) => {
 const siteDestinationSections = item?.siteDestinationSections.map(
                (siteDestinationSection) =>
                  new FormGroup({
                    id: new FormControl(siteDestinationSection.id),
                    siteCodeId: new FormControl(siteDestinationSection.siteCodeId),
                    images: this.fb.array(siteDestinationSection?.images.map(
                              (image) =>
                                new FormGroup({
                                  path: new FormControl(image.path),
                                  imageTag: new FormControl(image.imageTag),
                                  imageTitle: new FormControl(image.imageTitle),
                                  description: new FormControl(image.description),
                                  type: new FormControl(image.type),
                                }),
                            ),),
                    links:  this.fb.array(siteDestinationSection?.links.map(
                            (link) =>
                              new FormGroup({
                                link: new FormControl(link),
                             }),
                           ),)
                  }),
              );
 
              sections.push(
                this.fb.group({
                  siteDestinationSections: this.fb.array(siteDestinationSections),
                }),
              );
            });
}

// get siteDestinationSections as form array
  siteDestinationSections(sectionIndex): FormArray {
    return this.techDestinationSection
      .at(sectionIndex)
      .get('siteDestinationSections') as FormArray;
  }

html

<div formArrayName="siteDestinationSections" *ngFor="let siteSection of siteDestinationSections(sectionIndex).controls ; let siteSectionIndex=index"  >
  <div [formGroupName]="siteSectionIndex" class="d-flex flex-wrap">
      <div class="form-group" >
      <label class="label" [for]="'siteCodeId'+ siteSectionIndex">Site</label>
       <nb-select fullWidth placeholder="Select site" formControlName="siteCodeId"  [id]="'siteCodeId'+ siteSectionIndex" [(selected)]="selectedSiteForSite">
          <nb-option *ngFor = "let site of sites"  [value]="site.id" (selectionChange)="OnExistingSpecificSiteChange(siteSectionIndex)"> {{site.name}} </nb-option>
        </nb-select>
      </div>
  </div>
</div>

I have 3 drop-down for Site according to my data ( that's fine) . when fetching data, I got 3 different siteCodeId(2, 1, 3) , and the drop-down shows the site name for that siteCodeIds (That' alsoe fine)

But, My issue is When changing the value of one of those drop-down, all of the drop-down value has changed as selected-site, Example : IF I change the 3rd drop-down value as 1, then all the drop-down value is 1

Why This issue is happen? . what is wrong in my fromArray, FormGrop, Formcontrol?

I spend a lot of time on this issue. Please help me friends to fix this issue.