[ANGULAR] Addition of a extra column besides resource and mapping them

[Aniket]

Team,
I want to have some extra columns besides resources column, I have added them as per the API.
But while mapping them to field I am having issues in maping to object type.

this.columns ={
 {
        text: 'VehicleNumber',
        width: 49,      // default unit as per the api is pixel
        filterable: false,
        editor: true,
        type: 'number',
        field: 'vehicleNumber',
        sortable: false,
        draggable: false,
        align: 'center'

  },
}

This is how my data looks

"resources": {
        "rows": [
            {
                "id": 1,
                "name": "resorce1",
                "isLocked": false,
                "utilization": 0.0,
                "manufacturingDate": "2020-08-25T00:00:00Z",
                "weight": 0,
                "totalDuration": 4,
                "prototypeInfo" :
                {
               " vehicleNumber" : 1,
                "vehicleType" : 3,
                "prototypeNumber" : 4
                

            }
            ]
            }
 

Basically I want to map vehicleNumber property inside prototypeInfo to my column.

I am able to map standalone properties but no object type properties to field of column

Any thoughts?

[saki]

There are several steps to make it working.

1. You need to extend ResourceModel:

   class MyResource extends ResourceModel {
       static get fields() {
           return [
               { name : 'vehicleNumber', dataSource : 'vehicle.number'}
           ];
       }
   }

2. You need to let resourceStore to use this model:

   crudManager : {
       resourceStore : {
           modelClass : MyResource
       },
       // other configs
   },

3. configure scheduler columns:

   {
       text  : 'Vehicle Number',
       field : 'vehicleNumber'
   }

4. json for the above to work is:

   "rows": [
       {
           "id"        : 1,
           "name"      : "Rob",
           "type"      : "Sales",
           "eventColor": "orange",
           "vehicle" : {
               "number" : 333
           }
       },

[Aniket]

Thanks Saki,

This helped