Angular2: ngFor inside ngb-accordian always pointing to the last element

Question

I am developing an ngb-accordion based widget which internally contains a ngb-panel which contains a div which loops through an array of elements.

Data structure: 1-n
employee <------> previousEmployments 1-1
employee <------> insurance

The employee, insurance and previousEmployments are in separate ngb-panels. The ngb-panel that contains the previousEmployments contains a ngFor on a div element.

<div *ngFor="let previousEmploymenttemp of employee.previousEmployments; let i=index" >
        <div class="col-sm-12">          

    <div class="row">


    <div class="form-group col-md-4">       
    <ig-input  [inputField]="editForm.controls.company" [inputErrors]="editForm.controls.company?.errors">
        <label class="form-control-label" jhiTranslate="finaldemoApp.employee.previousEmployment.company" for="subfield_company">Company</label>

        <input type="text" class="form-control" name="company" id="subField_company"
            [(ngModel)]="previousEmploymenttemp.company"
         />
    </ig-input>

    </div> 
....
....

Let us assume that the employee.previousEmployments contains three elements, the ngFor loops through the elements but all the inputs contain the value of the element employee.previousEmployments[2] i.e the last element.

This may not be the problem but you're using the same ID (subField_company) for all the input elements. IDs are meant to be unique. — Titus
@Titus I made the IDs unique but the same problem is prevalent. — Prashanth Raghu
The problem was that I was using the same name attribute. Adding distinctness to the name solved the problem. stackoverflow.com/questions/39336708/… — Prashanth Raghu