Issues with angular integration

Answered

Hello,
Have just done the basic setup of WebDataRocks an Angular Application. Am able to connect to API service to load the data. However when i tried to customize the toolbar following the link: (https://www.webdatarocks.com/doc/customizing-toolbar/)   give the unexpected results. Basically the customizeToolbar function is not invoked at all. Am I missing something?
I have the below in Index.html:
  <link href=”https://cdn.webdatarocks.com/latest/webdatarocks.min.css” rel=”stylesheet”/>
  <script src=”https://cdn.webdatarocks.com/latest/webdatarocks.toolbar.min.js”></script>
  <script src=”https://cdn.webdatarocks.com/latest/webdatarocks.js”></script>
 
My component HTML is as below:
    <wbr-pivot #pivot1 [toolbar]=”true”
          [width]=”‘100%'”
          [height]=”500″
          [report]=”pivotReport”
          [customizeCell]=”onCustomizeCell”
          (ready)=”onPivotReady($event)”
          (beforetoolbarcreated)= “customizeToolbar”
          (reportcomplete)=”onReportComplete()”
         >
          
          >
    WebDataRocks will appear here
</wbr-pivot>
 
My component code with the constructor is :
   this.pivotReport =
    {
      toolbar: true,
      dataSource: {
        data: this.populateLinelisting()
      },
      grid: {
        ‘type’: ‘flat’,
        ‘showTotals’: ‘off’,
        ‘showGrandTotals’: ‘off’
      },
     beforetoolbarcreated: customizeToolbar,
    }; 
2).Though showGrandTotals/showTotals =off, those are appearing which are not relevant for my data which are mostly of textual content. How to permanently do such settings w/o using options menu? 
3) have tried to export my data in landscape mode using default option (I had ONLY 2 records)…Online view of the pdf had 2 pages where additional columns beyond ‘Portrait’ fitment falls on the second page.Any settings am i missing?
4). How to set grouping options from the code?. Note, I have couple of reports without any numeric data also.

Can you please help me with above four issues?…
Thanks
Asha.

1 answer

WebDataRocks Team WebDataRocks June 9, 2020

Hello Asha,
 
Thank you for the questions and sorry for the delayed answer.
Regrading your questions:
1. In Angular HTML code, please try (beforetoolbarcreated)="customizeToolbar($event)"
2. It can be achieved by setting global options. More details: https://www.webdatarocks.com/doc/init-api-call/
3. Could you please provide a sample where the issue with export is reproducible?
4. In case we understood correctly, you need to configure different reports. Please take a look at the following method: https://www.webdatarocks.com/doc/setreport/
 
Hope it helps.
 
Regards,
WebDataRocks Team