We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Data Doesn't change on tab change in pivot view

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.

1 Reply

SN Sivamathi Natarajan Syncfusion Team November 18, 2019 03:23 PM UTC

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() { 
      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' }]; 
      error => { 
        console.log('errors', error); 
Meanwhile, we have prepared a sample for your reference. Kindly check the below sample for your reference. 
Please let us know if you have concern. 
Sivamathi Natarajan 

Live Chat Icon For mobile
Up arrow icon