Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Sumesh ChandranSumesh Chandran 

push data to @track variable

I am trying to push the filter the data received from an apex method call and push it to a track variable @track variable. The below doesn't work, but no errors, no data is displayed. 
export default class MduPenetration extends LightningElement {
  @track bc;
  @track ab;

  @wire(getCityStats) cityStats({data}) {
    if (data) {
        for(let i=0;i<data.length;i++) {
            if(data.sumchans__Province_Code__c == 'BC') {
                this.bc.push(data[i]);
            }
            if(data.sumchans__Province_Code__c == 'AB') {
                this.ab.push(data[i]);
            }
           //this.stats.push(data.value); 
        }
    }
  }
}
Here is the HTML 
<template if:true={bc}>
                <template for:each={bc} for:item="city">
                    <lightning-layout class="slds-m-around_xxx-small" key={city.Name}>
                            <lightning-layout-Item>
                                {city.Name}
                            </lightning-layout-Item>
                            <lightning-layout-Item>
                                {city.sumchans__Province_Code__c}
                            </lightning-layout-Item>
                    </lightning-layout>
                </template>
            </template>
BUt simply this works 
export default class MduPenetration extends LightningElement {
  @track stats;;
   @wire(getCityStats) cityStats({data}) {
       if (data) {
           this.stats = data; 
        }
    }
  }

Please advise!

 
Best Answer chosen by Sumesh Chandran
Maharajan CMaharajan C
Hi Sumesh,

Please made the below changes then it will work:

1. Change the track properties as array. If the properties is not mentioned as array means you will get the error like : TypeError: Cannot read property 'push' of undefined in console

2. In If condition use the data[i]. 
export default class MduPenetration extends LightningElement {
@track bc = [];
@track ab = [];

@wire(getCityStats) cityStats({data}) {
if (data) {
	for(let i=0;i<data.length;i++) {
		if(data[i].sumchans__Province_Code__c == 'BC') {
			this.bc.push(data[i]);
		}
		if(data[i].sumchans__Province_Code__c == 'AB') {
			this.ab.push(data[i]);
		}
	   //this.stats.push(data.value); 
	}
}
}
}

Thanks,
Maharajan.C​​​​​​​

All Answers

Maharajan CMaharajan C
Hi Sumesh,

Please made the below changes then it will work:

1. Change the track properties as array. If the properties is not mentioned as array means you will get the error like : TypeError: Cannot read property 'push' of undefined in console

2. In If condition use the data[i]. 
export default class MduPenetration extends LightningElement {
@track bc = [];
@track ab = [];

@wire(getCityStats) cityStats({data}) {
if (data) {
	for(let i=0;i<data.length;i++) {
		if(data[i].sumchans__Province_Code__c == 'BC') {
			this.bc.push(data[i]);
		}
		if(data[i].sumchans__Province_Code__c == 'AB') {
			this.ab.push(data[i]);
		}
	   //this.stats.push(data.value); 
	}
}
}
}

Thanks,
Maharajan.C​​​​​​​
This was selected as the best answer
Sumesh ChandranSumesh Chandran
Thanks Maharajan, that worked. Also just wondering is this the best way to this. I have all the data pulled in to the cityStats variable. How would I be able to conditionally render in the HTML.