Compare current value with previous value in ionic 3


I need to compare object current value and previous value and change the colors as like high and low color.(High -> Green Low-> Red Normal-> Black). I’m developing the stock market application using ionic 3. I have assigned the current stock values in one object and displaying in view. My code looks like,

export class HomePage {
    oldbascrate: Object = {};
    baserates: Object = {};
    ionViewDidLoad() {
        this.oldbascrate = this.baserates;
   => {
              this.baserates  = data;

And in my view

<ion-row class="light-border-btm align-items raterow" *ngIf="baserates?.length !== 0 && oldbascrate?.length !== 0 && baserates['SPOT-GOLD'] != undefined && oldbascrate['SPOT-GOLD'] != undefined && baserates['CSILVER-1'] != undefined && baserates['SPOT-INR'] != undefined">
      <ion-col col-3 class="com-name">Gold</ion-col>
        <ion-col col-3 [ngClass]="{'ratehigh' : (baserates['SPOT-GOLD']['bid'] > oldbascrate['SPOT-GOLD']['bid']), 'ratelow':(baserates['SPOT-GOLD']['bid'] < oldbascrate['SPOT-GOLD']['bid']), 'ratenormal': (baserates['SPOT-GOLD']['bid'] == oldbascrate['SPOT-GOLD']['bid'])}">{{ baserates['SPOT-GOLD']['bid'] }}</ion-col>


And in my CSS

        background: #008000;
        color: #FFFFFF;
        background: #FF0000;
        color: #FFFFFF;
        color: #000000;

But this didn’t work now, and binding baserates values to oldbascrate. When I check with above code both object are equal. How can I compare this and change the colors. Could you please anybody can assistance me.


if both are equal then how can you show diff?
also, can’t able to understand why you bind the values inside ngzone. did actually you know what you did?


I’m getting update of current market stock data from service and assigning that data to => {
              this.baserates  = data;

I need to check current and previous value of this.baserates in my view file and update the color. This data will be receive as json object.
If I din’t use ngzone means view not getting update. For this only I have used ngzone.


check if the values are really same by console and if those are same then how can this work?


No it is not same. It is getting update for every second. If I console means values are showing different that previous value. Is there any other way in ionic to swap variable.


For example my console looks like this

[{com_name: "Gold Bar", buying_rate: "-", selling_rate: "3125.00"},{com_name: "Gold Ft", buying_rate: "3203.00", selling_rate: "-"}]
[{com_name: "Gold Bar", buying_rate: "-", selling_rate: "3124.00"},{com_name: "Gold Ft", buying_rate: "3204.00", selling_rate: "-"}]
[{com_name: "Gold Bar", buying_rate: "-", selling_rate: "3126.00"},{com_name: "Gold Ft", buying_rate: "3206.00", selling_rate: "-"}]

I have a code as like below,

liverates:any = [];
oldliverates:any = [];

   => {
				this.oldliverates = this.liverates;
				this.liverates  = data;

My view looks like,

 <ion-row class="light-border-btm align-items raterow" *ngFor="let liverate of liverates; let i = index">
     <ion-col col-4 class="com-name">{{liverate.com_name}}</ion-col>
     <ion-col col-4 [ngClass]="{'ratehigh' : (liverate.buying_rate > oldliverates[i].buying_rate), 'ratelow':(liverate.buying_rate < oldliverates[i].buying_rate), 'ratenormal': (liverate.buying_rate == oldliverates[i].buying_rate)}"> {{liverate.buying_rate}} </ion-col>
     <ion-col col-4 [ngClass]="{'ratehigh' : (liverate.selling_rate > oldliverates[i].selling_rate), 'ratelow':(liverate.selling_rate < oldliverates[i].selling_rate), 'ratenormal': (liverate.selling_rate == oldliverates[i].selling_rate)}">{{liverate.selling_rate}} </ion-col>

But this didn’t work to me. Could you please anybody help me to fix this issue. This is most urgent I have to give delivery to client.