paper-datatable-card not working

[chavu]

I have the code in the attached text file. The paper-datatable-card seem not to be working. The data is display the same way when I have only the paper-datatable. What am I doing wrong? I have enabled the paper elements listed in devDependencies by adding them to Dependencies but still no change. My data source has more than 100 items so I expect to see pagination on the table.

card.txt

[dhrytsenko]

Hi @chavu. To use paper-datatable-card you need to define few functions to get dataSource length, select data or update it. Take a look at docs and examples

[chavu]

Hello

I'm failing to get around this dataSource object thing. Please assist. I added a paper-datatable-card and paper-datatable in a CUBA platform Polymer client custom view component. Inside this component I'm using CUBA's component like below.

<cuba-service id="data"
            service-name="myapp_MyService"
            method="getMyMethod"
            data="{{entities}}"
            loading="{{dataLoading}}"
            auto="[[active]]"
            count="{{entitiesCount}}"
            handle-as="json">
</cuba-service>

This component ill populate the {{entities}} property with an array list all data from database and also the {{entitiesCount}} with the count of records. My challenge now is to initialise the paper-datatable-card's {{dataSource}} object with this data. My attempt below is giving error message "TypeError: invalid 'in' operand this.dataSource".

 <script>
    Polymer({
      is: 'my-component',
      behaviors: [CubaLocalizeBehavior, CubaEntityListViewBehavior,CubaAppAwareBehavior],
      properties: {
        entities: Array,
        entitiesCount: Number,
        dataSource: {
          type: Object,
          value:         {
                get: function(sort, page, pageSize){
                    return new Promise(function(resolve, reject){
                        resolve(this.entities);
                    });
                },
                    set: function(id, property, value){
                      //console.info("a save was triggered", arguments);
                  },            
                length: this.entitiesCount
          }
        }
      }, 
    });

  </script>

[dhrytsenko]

@chavu you in right direction. You only need to save scope cause in promise we don't get right this. Try this:

get: function(sort, page, pageSize){
  var self = this;
  return new Promise(function(resolve, reject){
    resolve(self.entities);
  });
};

[chavu]

var self = this; 

is not working. Both self and this refer to the get function and not the main page component

[dhrytsenko]

Closed due to inactivity. You can open it again if still have this problem