Me gustaría traducir mi código con i18next para mi proyecto angular.

He instalado: i18next, i18next-xhr-backend, i18next-browser-languagedetector

Usando mucho ngfor en mi código -> No sé cómo usar i18next en interpolaciones de cadenas.

En este ejemplo a continuación, me gustaría traducir item.label.

 <ng-container *ngFor="let item of listOfItems; let i = index">

 <mat-grid-tile rowspan="1" class="{{ item.visible === 'false' ? 'invisible' : '' }}"> <button *ngIf="item && !isItemSelected(item)" (click)="selectItem(item)" mat-raised-button class="action-button {{ item.color }}"> <span class="action-button-text">{{ item.label }}</span> </button> </mat-grid-tile> </ng-container>```

Aquí está mi lista de etiquetas:

 [{ "id": "1", "label": "flower", "subject": "plant", "visible": "true", "color": "yellow" }, { "id": "2", "label": "bread", "subject": "table", "visible": "false", "color": "white" }, { "id": "3", "label": "glass", "subject": "table", "visible": "true", "color": "green" }, { "id": "4", "label": "pissenlit", "subject": "plant", "visible": "true", "color": "yellow_green" }]

aquí está mi lista de traducción inglés y francés: en:

 {"flower":"flower", "bread":"bread", "glass":"glass" "pissenlit":"pissenlit" }

FR

 {"flower":"fleur", "bread":"pain", "glass":"verre" "pissenlit":"pissenlit" }```