Изменить ответ JSON для привязки к сетке кендо - PullRequest
Новая
       56

Изменить ответ JSON для привязки к сетке кендо

0 голосов
/ 04 мая 2020

Я пытаюсь связать данные, которые я получаю от вызова API. Ниже приведен пример структуры ответа JSON. 

{
"portfolioID": 3024,
"gridType": "OWNER",
"gridLayoutId": 4,
"totalRecordCount": 111,
"attributeMetaData": [
    {
        "attributeId": 94,
        "attributeName": "OWNERTYPE",
        "objectType": "OWNER",
        "filterValue1": "",
        "filterValue2": "",
        "filterOperator1": "",
        "filterOperator2": "",
        "columnSortOrder": 0,
        "sortType": "",
        "attributeDisplayName": "TYPE",
        "columnOrder": 1,
        "isGeneralAttribute": "true",
        "isIndustryAttribute": "",
        "isCustomerAttribute": "",
        "dataSource": "Pega",
        "isHidden": "false",
        "isActionable": "",
        "actionType": "",
        "referenceAttribute": "",
        "attributeDataType": "STRING",
        "columnWidth": "",
        "isFreezable": ""
    },
    {
        "attributeId": 95,
        "attributeName": "OWNERSTATUS",
        "objectType": "OWNER",
        "filterValue1": "",
        "filterValue2": "",
        "filterOperator1": "",
        "filterOperator2": "",
        "columnSortOrder": 0,
        "sortType": "",
        "attributeDisplayName": "STATUS",
        "columnOrder": 2,
        "isGeneralAttribute": "true",
        "isIndustryAttribute": "",
        "isCustomerAttribute": "",
        "dataSource": "Pega",
        "isHidden": "false",
        "isActionable": "",
        "actionType": "",
        "referenceAttribute": "",
        "attributeDataType": "STRING",
        "columnWidth": "",
        "isFreezable": ""
    },
    {
        "attributeId": 93,
        "attributeName": "PREFERREDNAME",
        "objectType": "OWNER",
        "filterValue1": "",
        "filterValue2": "",
        "filterOperator1": "",
        "filterOperator2": "",
        "columnSortOrder": 1,
        "sortType": "ASC",
        "attributeDisplayName": "LICENSE OWNER NAME",
        "columnOrder": 3,
        "isGeneralAttribute": "true",
        "isIndustryAttribute": "",
        "isCustomerAttribute": "",
        "dataSource": "Pega",
        "isHidden": "false",
        "isActionable": "true",
        "actionType": "VIEWPAGE",
        "referenceAttribute": "LICENSEOWNERID",
        "attributeDataType": "STRING",
        "columnWidth": "",
        "isFreezable": ""
    },
    {
        "attributeId": 115,
        "attributeName": "LICENSEOWNERID",
        "objectType": "OWNER",
        "filterValue1": "",
        "filterValue2": "",
        "filterOperator1": "",
        "filterOperator2": "",
        "columnSortOrder": 0,
        "sortType": "",
        "attributeDisplayName": "LICENSEOWNERID",
        "columnOrder": 0,
        "isGeneralAttribute": "true",
        "isIndustryAttribute": "",
        "isCustomerAttribute": "",
        "dataSource": "Pega",
        "isHidden": "true",
        "isActionable": "",
        "actionType": "",
        "referenceAttribute": "",
        "attributeDataType": "INTEGER",
        "columnWidth": "",
        "isFreezable": ""
    }
],
"attributeValues": [
    {
        "objectId": 133218,
        "attributeList": [
            {
                "attributeId": 94,
                "attributeValue": "Entity",
                "referenceObjectId": null
            },
            {
                "attributeId": 95,
                "attributeValue": "Active",
                "referenceObjectId": null
            },
            {
                "attributeId": 93,
                "attributeValue": null,
                "referenceObjectId": "133218"
            },
            {
                "attributeId": 115,
                "attributeValue": "133218",
                "referenceObjectId": null
            }
        ]
    },
    {
        "objectId": 134179,
        "attributeList": [
            {
                "attributeId": 94,
                "attributeValue": "Individual",
                "referenceObjectId": null
            },
            {
                "attributeId": 95,
                "attributeValue": "Active",
                "referenceObjectId": null
            },
            {
                "attributeId": 93,
                "attributeValue": "Ra vi Teja",
                "referenceObjectId": "134179"
            },
            {
                "attributeId": 115,
                "attributeValue": "134179",
                "referenceObjectId": null
            }
        ]
    }        
]
}

Перед вызовом API я связал фиктивные данные с сеткой. Таким образом, фиктивные данные выглядят примерно так: 

export const sampleProducts = [
{
    "ProductID": 1,
    "ProductName": "Chai",
    "SupplierID": 1,
    "CategoryID": 1,
    "QuantityPerUnit": "10 boxes x 20 bags",
    "UnitPrice": 18,
    "UnitsInStock": 39,
    "UnitsOnOrder": 0,
    "ReorderLevel": 10,
    "Discontinued": false,
    "Category": {
        "CategoryID": 1,
        "CategoryName": "Beverages",
        "Description": "Soft drinks, coffees, teas, beers, and ales"
    },
    "FirstOrderedOn": new Date(1996, 8, 20)
},
{
    "ProductID": 2,
    "ProductName": "Chang",
    "SupplierID": 1,
    "CategoryID": 1,
    "QuantityPerUnit": "24 - 12 oz bottles",
    "UnitPrice": 19,
    "UnitsInStock": 17,
    "UnitsOnOrder": 40,
    "ReorderLevel": 25,
    "Discontinued": false,
    "Category": {
        "CategoryID": 1,
        "CategoryName": "Beverages",
        "Description": "Soft drinks, coffees, teas, beers, and ales"
    },
    "FirstOrderedOn": new Date(1996, 7, 12)
}
];

В случае фиктивных данных я просто использовал приведенный ниже код для привязки данных к моей сетке

In .ts file 

public gridData: any = products;

In. html file 

<kendo-grid
      [data]="gridData"
      [height]="410"
      [loading]="view.loading"
      >
        <kendo-grid-column *ngFor="let col of columns" [field]="col.field"></kendo-grid-column>
</kendo-grid>

То же самое HTML работает и сейчас, но мне трудно сделать так, чтобы ответ API, который я получаю сейчас, был понятен моей сетке. Как мы видим, в фиктивном отображении данных столбца и значения довольно просто, но в API отображение ответа осуществляется через свойство attributeID. «attributeName» - это имя столбца. Может кто-нибудь, пожалуйста, подскажите мне, как я могу это реализовать. Заранее спасибо.

...