Итерация массива внутри массива и привязка данных в html с использованием интерполяции строк в angular

Я хочу выполнить итерацию по моему массиву данных json и связать данные с помощью интерполяции строк в моем html-файле. Мои данные JSON ниже

export interface Patient {
    _id: string;
    name: string;
    gender: string;
    age: number;
}

export interface Range {
    unit: string;
    high?: number;
    low?: number;
}

export interface Result {
    result: string;
    test_name: string;
    range: Range;
    reference_range: string;
    description: string;
    critical_range: Critical;
}

export interface Critical {
    low: number;
    high: number;
}

export interface TestOrder {
    name: string;
    priority: number;
    pixel_height: number;
    result: Result;
}

export interface Testgroup {
    name: string;
    priority: number;
    weight: number;
    exclusive: boolean;
    test_order: TestOrder[];
    special_font: number;
    attachment: boolean;
}

export interface Report {
    department_name: string;
    department_proirity: number;
    testgroups: Testgroup[];
}

export interface Price {
    mrp: number;
    user: number;
}

export interface Doctor {
    approved_on: string;
    approved_by: string;
    doctor_sign: string;
}

export interface RootObject {
    patient: Patient;
    approved_by_doctor: Doctor;
    report: Report[];
    price: Price;
    doctor: string;
    lab: string;
    booking_id: string;
    sample_date: string;
    report_header: string;
}

export interface ReportInterface {
    status: boolean;
    message: string;
    code: number;
    data: RootObject;
}

Я пытаюсь перебрать данные моего отчета и напечатать имя тестовой группы на складной панели материала для каждой тестовой группы на складной панели. Ниже приведен мой html-код. Имя моего интерфейса — reportInterface, куда я помещаю свои данные json.

<div *ngFor = "let report1 of reportInterface.report">
    <div *ngFor = "let testgroup of report1.testgroups">
        <div class = "w3-container w3-card w3-white w3-round w3-margin"><br>
            <div class = "w3-row-padding"
                style = "margin:0 -16px">
                <mat-accordion>
                    <mat-expansion-panel (opened) = "panelOpenState = true"
                        (closed) = "panelOpenState = false">
                        <mat-expansion-panel-header>
                            <mat-panel-title>
                                <p style = "color:#385b9d;font-weight: 700"> {{testgroup.name}}
                                </p>
                            </mat-panel-title>

                            <mat-panel-description>
                                {{panelOpenState ? 'Close' : 'Open'}}
                            </mat-panel-description>
                        </mat-expansion-panel-header>

                        <div *ngFor = "let testorder of testgroup.test_order">
                            <p style = "font-weight:600">{{testorder.name}}</p>

                            <div *ngIf = "testgroup.attachment===false">
                                <p>This test is bad</p>
                            </div>

                            <div *ngIf = "testorder.result.result<testorder.result.range.low || 
        testorder.result.result>testorder.result.range.high">
                                <p style = "color:red;font-weight: 500">Result :
                                    {{testorder.result.result}}</p>
                            </div>

                            <div *ngIf = "testorder.result.result>=testorder.result.range.low && 
        testorder.result.result<=testorder.result.range.high">
                                <p style = "color:rgb(0,255,0);font-weight: 
        500">Result : {{testorder.result.result}}</p>
                            </div>

                            <p style = "font-weight:500">Reference Range :
                                {{testorder.result.reference_range}}</p>

                            <p>Description:{{testorder.result.description}}</p>

                            <hr>
                        </div>
                    </mat-expansion-panel>
                </mat-accordion>
            </div>
        </div>
    </div>
</div>

Проблема с этим кодом заключается в том, что он зацикливается дважды, поэтому вместо того, чтобы печатать складную карту 2 раза, он печатает 4 раза. Пожалуйста помоги.