What's the good write to display this json form in angular 13

Issue

So to be simple i've got in json this:response img my classes are :

export class Operation {
       operations?: (OperationDetail);//change by OperationDetail[]
     }
     export interface OperationDetail {
            id?: string;
            titre?: any;
            description?: any;
            debut?: any;
            fin?: any;
            statut?: any;
            etat?: any;
            notification?: any;
            alerte?: any;
            ouvrages?: any;
            chefEus?: BigInt;
            donneurOrdres?: any;
            linkedOperations?: number[];

}

my service to get my operation:

getOperations(): Observable<Operation>{
    return  this.http.get<Operation>(this.operationUrl)
          .pipe(map(response=> ({
          operations: response.operations,
         })
            ),
          );
  }

in html i try different thing but i'm sure that this: {{ operations.operations.id }} tell me that he is undefined but right in my class OperationDetail that i wanna display. So after many research i search someone to end this mystery pls ;)

Update:

Hello i finally did it by passing my (OperationDetail) in OperationDetail[]. then in my html i ngFor like that to take the data. loop:

<div *ngFor="let operation of operations?.operations">
  <p class="left"> Titre: {{ operation?.titre }}</p>
</div>

Thanks everyone for your speed ;)

Solution

Try with an array :

operations?: OperationsDetails[];

Answered By - Erwan Sturzenegger