Data Doesn't change on tab change in pivot view

[Amit Vijayvargiya]

Hi Team,

I am trying to implement to pivot component.

Requirement: On tab click, I want to load the pivot component. Whatever the data comes from the response bind to the pivot view.

I have load the pivot view on ngOnIt() function with sample data. When i click on another tab and the repsonse comes from the API, i need to map those data on the pivot view data source setting. But it is referring to the old data which is loaded on ngOnIt.

[Sivamathi Natarajan]

Hi Amit, 

  

Thanks for contacting Syncfusion Support. 

  

We have prepared a sample as per requirement. Code changes made in the provide sample. Please change the values of the rows, columns  and values axis data to the appropriate binded dataSource. 

  

 

Code Example: [app.component.ts] 

 

loadJsonData() { 

    this.pivotService.getPivotData().subscribe( 

      data => { 

        this.pivotObj.dataSourceSettings.dataSource = data as IDataSet[]; 

        this.pivotObj.dataSourceSettings.rows = [{ name: 'Orders.customerNumber' }, { name: 'Customers.city' }]; 

        this.pivotObj.dataSourceSettings.columns = [{ name: 'Offices.city' }, { name: 'Employees.reportsTo' }]; 

        this.pivotObj.dataSourceSettings.values = [{ name: 'Orders.customerNumber' }]; 

        console.log(data); 

      }, 

      error => { 

        console.log('errors', error); 

      } 

    ) 

  } 

 

 

  

Meanwhile, we have prepared a sample for your reference. Kindly check the below sample for your reference. 

 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/255461/ze/my-app2084262591 

 

  

Please let us know if you have concern. 

 

  

Regards, 

Sivamathi Natarajan