Dynamic Column or Rows Configuration

Question

Hi TeamIs there any I can set the columns & Rows array in PivotView Configuration dynamically based on dynamic Datasource?Sometimes, 3 columns appear in my datasource and sometime 4. (Dynamic in nature)

Sivamathi Natarajan · Accepted Answer

Hi ShreeKumar, 
 
Thanks for contacting Syncfusion support. 
 
Kindly add the column fields based on the data source dynamically using following code example. Here we have modified data source in drop down list and validated the season field in data source. And add/remove the validated column field to pivot table. 
 
Code Example: 
 




  onChange(args: ChangeEventArgs): void { 
    if (args.value === "DataSource2") { 
      this.pivotObj.dataSourceSettings.dataSource = Pivot_Data2; 
      var dataKeys = Object.keys(this.pivotObj.dataSourceSettings.dataSource[1]); 
      if ((dataKeys as any).includes("season")) 
        this.pivotObj.dataSourceSettings.columns.push({ name: 'season' }); 
    } 
    else { 
      this.pivotObj.dataSourceSettings.dataSource = Pivot_Data1; 
      var columns = this.pivotObj.dataSourceSettings.columns; 
      for (var i = 0; i < columns.length; i++) { 
        if (columns[i].name === "season") 
          this.pivotObj.dataSourceSettings.columns.pop(); 
      } 
    } 
  } 
 
 
 
Meanwhile, we have prepared a sample for your reference. Please check the below sample link. 
 
Sample Link: https://stackblitz.com/edit/angular-fyeewv-ck78ft?file=app.component.ts 
 
We hope the above sample meets your requirements. 
 
Regards, 
Sivamathi.