How to dynamically get the absolute index in Angular FormArray fields after pagination?

Question

I am using a form array to display the data and have a method to dynamically add rows in a table. I will check multiple rows from one table ASNlst and push it to other table ConnectedASNlst .This works fine. But having pagination implemented now when i try to check a row from second page (Ex: page 2 and row 3), i will still see page 1 and row 3 record moving from ASNlst to ConnectedASNlst. How to get the index value for dynamic reactive forms

I tried using slice but this did not work

 <tr formArrayName="ASNlst" *ngFor="let availableASN of
  lstAvailableASN | slice: (page-1) * pageSize : (page-1) * pageSize +
  pageSize ;let i = index;">

---

<form [formGroup]="form" (ngSubmit)="submitToConnect()">              
    <table class="table table-condensed">                  
        <tr formArrayName="ASNlst" *ngFor="let availableASN of lstAvailableASN ; let isCollapsed = true;let i = index;">                    
            <td>
                <input type="checkbox" [formControlName]="i" checked (change)="selChk(availableASN, i)" />
            </td>
            <td class=" form-control-sm">
                <div>
                    Supplier:
                    <b>{{availableASN.supplier}}</b>
                </div>
                <div>
                    ASN:
                    <b>{{availableASN.asnNumber}}</b>
                </div>
                <div>
                    ShipDateTime:
                    <b>{{availableASN.shipDate}}</b>
                </div>                      
            </td>
        </tr>
    </table>
    <button class="col-12 btn btn-secondary btn-sm" id="btnClearConnect" type="submit" [disabled]="form.invalid">Connect</button>
</form>

I should able to move the checked rows from all the pages from ASNlst to ConnectedASNlst. Basically How do I get the absolute index of a list item?