Get the index of line element from an expansive Angular mat-table

Question

I have a project that has a mat-table with lines that expand on click. Inside these lines I have a model and I need to pass the index of this line to this model, but the *matCellDef="let element; let i = index" is not returning anything. This is the code:

                                <ng-container matColumnDef="{{column}}"
                                    *ngFor="let column of columnsToDisplay; let i = index">
                                    <th mat-header-cell *matHeaderCellDef> {{cols[i]}} </th>
                                    <td mat-cell *matCellDef="let element">
                                        <span *ngIf="column === 'cvCodMarcacao'"> {{element[column] }}</span>
                                        <span *ngIf="column === 'ccNomFun'"> {{element[column]}}</span>
                                        <span *ngIf="column === 'tipoFull'">{{element[column]}}</span>
                                        <span *ngIf="column === 'ccTipMarcFull'">
                                            <div [innerHtml]="element[column]"></div>
                                        </span>
                                        <span *ngIf="column === 'acoes'">
                                            <button (click)="aprovar(element, element.ObsInclParMarc, $event)"
                                                mat-raised-button class="btn btn-primary">Aprovar</button>
                                            <button (click)="rejeitar(element, $event)" mat-raised-button
                                                class="btn btn-warning">Rejeitar</button>
                                        </span>
                                    </td>
                                </ng-container>

                                <ng-container matColumnDef="expand">
                                    <th mat-header-cell *matHeaderCellDef aria-label="row actions"></th>
                                    <td mat-cell *matCellDef="let element">
                                        <button mat-icon-button aria-label="expand row"
                                            (click)="(expandedElement = expandedElement === element ? null : element); $event.stopPropagation()">
                                            <mat-icon *ngIf="expandedElement !== element">keyboard_arrow_down
                                            </mat-icon>
                                            <mat-icon *ngIf="expandedElement === element">keyboard_arrow_up
                                            </mat-icon>
                                        </button>
                                    </td>
                                </ng-container>

                                <ng-container matColumnDef="expandedDetail">
                                    
                                    <td mat-cell *matCellDef="let element;columns: columnsToDisplay;let i = index;"
                                        [attr.colspan]="columnsToDisplayWithExpand.length">
                                        <div class="element-detail"
                                            [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'">

                                            <div class="col-lg-12 col-md-12 container-tabs">
                                                <hr>
                                                <p><strong>Justificativa: {{i}}</strong>
                                                    {{element.ccJustificativa}}</p>

                                                <h2>ATENÇÃO: A aprovação desta solicitação irá gerar as seguintes
                                                    infrações:</h2>
                                                <p [innerHtml]="element.ObsInclParMarc"></p>

                                                <div
                                                    *ngIf="element.ObsInclParMarc != null || habilitarJustificativa == true">
                                                    <label>Justificativa</label>
                                                    <textarea matInput class="text-area"
                                                        [(ngModel)]="jutificativaModel[i]"></textarea>
                                                </div>
                                            </div>


                                        </div>
                                    </td>
                                </ng-container>

                                <tr mat-header-row *matHeaderRowDef="columnsToDisplayWithExpand"></tr>
                                <tr mat-row *matRowDef="let element; columns: columnsToDisplayWithExpand;"
                                    class="element-row" [class.expanded-row]="expandedElement === element"
                                    (click)="expandedElement = expandedElement === element ? null : element">
                                </tr>
                                <tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="linha-detalhe">
                                </tr>
                            </table>

The variable i does not return anything