как получить доступ к объектам массива угловым к матовой таблице

Question

У меня есть ответ json

{

"hostAddress": "rsc0vm148177",
"buildversion": 10.23,
"alltests": "11",
"allpass": 12,
"allerrors": 555,
"allfails": "11",
"testsummary": [

    {

        "tests": "1",
        "fail": "1",
        "error": "0",
        "pass": "0",
        "packageName": "010_prod_sample_2015nov ",
        "testcases": [{
            "date": " 2019-02-21 18:48:59",
            "className": " 07_s2m ",
            "testName": " s2m.matrix_tc0005.utt ",
            "rrn": " 123451234512 ",
            "endpoints": "  MIG_MSI_EP1 MDS_S2A_EP1  ",
            "result": " Fail  ",
            "failReason": "  nothing received "
        }]
    },
    {

        "tests": "10",
        "fail": "10",
        "error": "0",
        "pass": "0",
        "packageName": "011_project_y2011 ",
        "testcases": [{
                "date": " 2019-02-21 16:49:42",
                "className": " 04_new_prodcodes ",
                "testName": " tc02_s2i_mc_0100_DAP.utt ",
                "rrn": " 000463000046 ",
                "endpoints": "  MIG_NT2_EP2 CIS_EP1  ",
                "result": " Fail  ",
                "failReason": "  nothing received "
            },

            {
                "date": " 2019-02-21 16:48:47",
                "className": " 03_bnet_core ",
                "testName": " tc03c_s2i_visa_0100_0420.utt ",
                "rrn": " 000463000046 ",
                "endpoints": "  MIG_NT2_EP2 CIS_EP1  ",
                "result": " Fail  ",
                "failReason": "  nothing received "
            },
            {
                "date": " 2019-02-21 16:48:18",
                "className": " 03_bnet_core ",
                "testName": " tc03b_s2i_visa_0100_0420.utt ",
                "rrn": " 000463000046 ",
                "endpoints": "  MIG_NT2_EP2 CIS_EP1  ",
                "result": " Fail  ",
                "failReason": "  nothing received "

            }
        ]
    }
]

}

Я хочу получить доступ к json, как testsummary.tests, testssummary.fail и отобразить в шаблоне

my html

<div class="mat-elevation-z8">
<table mat-table [dataSource]="resultssummaries" multiTemplateDataRows  class="mat-elevation-z8" matSort width="100%">

    <!--- Note that these columns can be defined in any order.
            The actual rendered columns are set as a property on the row definition" -->

    <!-- Currency Code Column -->
    <ng-container matColumnDef="id">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> id </th>
        <td mat-cell *matCellDef="let resultssummaries" align="left"> {{resultssummaries.id}} </td>
    </ng-container>

    <!-- Currency Symbol Column -->
    <ng-container matColumnDef="build">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Build </th>
        <td mat-cell *matCellDef="let resultssummaries" align="left"> {{resultssummaries.buildversion}} </td>
    </ng-container>

    <!-- Base Name Column -->
    <ng-container matColumnDef="host">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Host Name </th>
        <td mat-cell *matCellDef="let resultssummaries" align="left"> {{resultssummaries.hostAddress}} </td>
    </ng-container>

    <!-- Fraction Symbol Column -->
    <ng-container matColumnDef="tests">
        <th mat-header-cell *matHeaderCellDef align="center"> Tests </th>
        <td mat-cell *matCellDef="let resultssummaries" align="center"> {{resultssummaries.alltests}} </td>
    </ng-container>

    <!-- Fraction Name Column -->
           <ng-container matColumnDef="pass">
        <th mat-header-cell *matHeaderCellDef> Pass </th>
        <td mat-cell *matCellDef="let resultssummaries" align="left"> {{resultssummaries.allpass}} </td>
    </ng-container>




    <ng-container matColumnDef="expandedDetail">
        <td mat-cell *matCellDef="let element" [attr.colspan]="displayedColumns.length">
            <div class="example-element-detail"
                 [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'" >
                <table mat-table [dataSource]="resultssummaries.testsummary" multiTemplateDataRows  class="mat-elevation-z8" matSort width="100%">

                    <!--- Note that these columns can be defined in any order.
                            The actual rendered columns are set as a property on the row definition" -->

                    <!-- Currency Code Column -->
                    <ng-container matColumnDef="package">
                        <th mat-header-cell *matHeaderCellDef mat-sort-header> package name </th>
                        <td mat-cell *matCellDef="let test" align="left"> {{test.package_name}} </td>
                    </ng-container>

                    <!-- Currency Symbol Column -->
                    <ng-container matColumnDef="tests">
                        <th mat-header-cell *matHeaderCellDef mat-sort-header> Tests </th>
                        <td mat-cell *matCellDef="let test" align="left"> {{test.tests}} </td>
                    </ng-container>

                    <!-- Base Name Column -->
                    <ng-container matColumnDef="fail">
                        <th mat-header-cell *matHeaderCellDef mat-sort-header> Fail </th>
                        <td mat-cell *matCellDef="let test" align="left"> {{test.fail}} </td>
                    </ng-container>

                    <!-- Fraction Symbol Column -->
                    <ng-container matColumnDef="error">
                        <th mat-header-cell *matHeaderCellDef align="center"> Error </th>
                        <td mat-cell *matCellDef="let test" align="center"> {{test.error}} </td>
                    </ng-container>

                    <!-- Fraction Name Column -->
                    <ng-container matColumnDef="pass">
                        <th mat-header-cell *matHeaderCellDef> Pass </th>
                        <td mat-cell *matCellDef="let test" align="left"> {{test.pass}} </td>
                    </ng-container>




                    <ng-container matColumnDef="expandedDetail">
                        <td mat-cell *matCellDef="let element" [attr.colspan]="displayedColumns.length">
                            <div class="example-element-detail"
                                 [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'" >
                                <table width="100%">

                                    <tr>
                                        <td align="left">Original Record: <b></b></td>
                                    </tr>
                                    <tr>
                                        <td align="left"><p class="FailedMessage">Error: <b></b></p></td>


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



                    <tr mat-header-row *matHeaderRowDef="displayedColumnsTestSummary"></tr>
                    <tr mat-row *matRowDef="let row; columns: displayedColumnsTestSummary;" class="example-element-row"
                        [class.example-expanded-row]="expandedElement === row"
                        (click)="expandedElement = row"></tr>
                    <tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="example-detail-row"></tr>
                </table>


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



    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
    <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="example-element-row"
        [class.example-expanded-row]="expandedElement === row"
        (click)="expandedElement = row"></tr>
    <tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="example-detail-row"></tr>
</table>

Я перепробовал множество вариантов, не уверен, как это получить. Любая помощь будет принята с благодарностью.Я пытаюсь использовать угловой материал таблицы.потратили почти 2 дня на его поиск и пробование различных решений.я пытался использовать json pipe, параметры ключевого значения, но не смог найти решение, которое я пытаюсь достичь, это

"hostAddress": "rsc0vm148177",
"buildversion": 10.23,
"alltests": "11",
"allpass": 12,
"allerrors": 555,
"allfails": "11",

выше в одной строке, когда строка нажата, она должна развернуться и отобразить подробные данные теста.что составляет

 "tests": "1",
 "fail": "1",
 "error": "0",
 "pass": "0",
  packageName": "010_prod_sample_2015nov ",

, когда по вышеуказанному щелкают другую внутреннюю таблицу, чтобы отобразить тестовые случаи, которые

date": " 2019-02-21 18:48:59",
        "className": " 07_s2m ",
        "testName": " s2m.matrix_tc0005.utt ",
        "rrn": " 123451234512 ",
        "endpoints": "  MIG_MSI_EP1 MDS_S2A_EP1  ",
        "result": " Fail  ",
        "failReason": "  nothing received "