猿问

如何使用材质角度将嵌套的 json 数组显示到 html 表中

我正在尝试将嵌套的 json 数组显示到我的材质角度表中。如果我的 json 没有嵌套数组,我的数据工作正常。


杰森


{

"rows": [

    {

        "mst": {

            "field": "createDate",

            "value": "2017-06-02"

        },

        "gsc": {

            "field": "Account/Audit/Creation/Date",

            "value": "2017-06-02"

        }

    },

    {

        "mst": {

            "field": "startDate"

        },

        "gsc": {

            "field": "startDate"

        }

    },

    {

        "mst": {

            "field": "status",

            "value": "ACTIVE"

        },

        "gscs": [

            {

                "field": "Account/LineOfBusiness/Type~Status",

                "value": "C~A"

            },

            {

                "field": "Account/LineOfBusiness/Type~Status",

                "value": "I~A"

            }                

        ],

        "gscvalue": "Active"

    },

    {

        "mst": {

            "field": "statusDate"

        },

        "gsc": {

            "field": "statusDate"

        }

    },

    {

        "mst": {

            "field": "statusReason"

        },

        "gsc": {

            "field": "statusReason"

        }

    },

    {

        "mst": {

            "field": "deliveryMethod",

            "value": "PAPER"

        },

        "gscs": [

            {

                "field": "Electronic",

                "value": "N"

            },

            {

                "field": "ElectronicOutsourced",

                "value": "N"

            },

            {

                "field": "Hardcopy",

                "value": "Y"

            }

        ],

        "gscvalue": "Paper"

    },

    {

        "mst": {

            "field": "statementFormat",

            "value": "Standard"

        },

        "gsc": {

            "field": "?"

        }

    },

    {

        "mst": {

            "field": "statementLanguagePreference",

            "value": "Spanish"

        },

        "gsc": {

            "field": "Account/Language",

            "value": "S"

        },

        "gscvalue": "Spanish"

    },



潇湘沐
浏览 119回答 1
1回答

慕的地6264312

似乎你只需要嵌套你的ngIf:<ng-container matColumnDef="gsc Fields">&nbsp; <th mat-header-cell *matHeaderCellDef> gsc Fields </th>&nbsp; <td mat-cell *matCellDef="let row">&nbsp; &nbsp; <ng-container *ngIf="row.gsc?.field; else fieldArray">&nbsp; &nbsp; &nbsp; {{row.gsc.field}}&nbsp;&nbsp; &nbsp; </ng-container>&nbsp; &nbsp; <ng-template #fieldArray>&nbsp; &nbsp; &nbsp; <div class="sub-cell" *ngFor="let field of row.gscs"> <!-- need the appropriate css -->&nbsp; &nbsp; &nbsp; &nbsp; {{field.field}} {{field.value}}&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </ng-template>&nbsp; </td></ng-container>在你的价值栏中你想要更多类似的:<ng-container matColumnDef="gsc">&nbsp; <th mat-header-cell *matHeaderCellDef> gsc value </th>&nbsp; <td mat-cell *matCellDef="let row"> {{row.gsc?.value || row.gscvalue}} </td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</ng-container>不确定这是 100% 但应该很接近
随时随地看视频慕课网APP

相关分类

Html5
我要回答