I have three variables (before), (current) and (after).
I am getting data from an API constantly (every 1sec).
I am saving my current API info as (before) prior to updating and then I store the update in (after) once I update.
I am checking to see if before is different than (After), if so I am adding a class to the DOM.
Now the problem
When I console.log the values I can clearly see that at some points the two values differ. This is great, but when I bind the exact same data to the DOM, they are always the same. Has anyone seen this before?
DOM
<div class="ticker" *ngFor="let coinresult of coinResults; let beforecoinresult of beforeCoinResults; let aftercoinresult of afterCoinResults; let i = index;">
<div class="wrapper" *ngIf="coinresult.name != step2Selection">
<h1>Before: {{beforecoinresult.amount}} - After: {{aftercoinresult.amount}}</h1>
<div class="pin" (click)="pinTitle(coinresult.amount, coinresult.name)">
<i class="material-icons" *ngIf="pinnedCoinAmount != coinresult.amount">gps_not_fixed</i>
<i class="material-icons selectedCoin" *ngIf="pinnedCoinAmount === coinresult.amount">gps_fixed</i>
</div>
<div class="amount" [ngClass]="{amountpinned: pinnedCoinAmount === coinresult.amount,
amountincrease: beforecoinresult.amount < aftercoinresult.amount,
amountdecrease: beforecoinresult.amount > aftercoinresult.amount}">
{{coinresult.amount}}
</div>
<div class="name" [ngClass]="{ namepinned: pinnedCoinAmount === coinresult.amount,
nameincrease: beforecoinresult.amount < aftercoinresult.amount,
namedecrease: beforecoinresult.amount > aftercoinresult.amount}">
{{coinresult.name}}
</div>
</div>
Component
convert(){
this.beforeCoinResults = this.coinResults;
if(this.holdings){
console.log("before " + this.beforeCoinResults[0].amount);
}
this.coinResults = [];
if(this.cryptoSelected && this.step2Selection){
//convert all the crypto to currencies
for (var i = 0; i<= this.currencies.length -1 ; i++){
var tempName = this.currencies[i] as string;
this.coinResults.push({
name: this.convertName(tempName as string),
amount: Math.round(this.holdings * this.ticker[this.convertName(this.step2Selection)].last * this.ticker['USDT_BTC'].last* this.currencyExchange[tempName]*100)/100}
); // push
} // for
//convert all the crypto to crypto
for(var i = 0 ; i <= this.coins.length - 1; i++){
var tempName = this.coins[i] as string;
this.coinResults.push({
name: this.convertName(tempName as string),
amount: Math.round(this.holdings * this.ticker[this.convertName(this.step2Selection)].last / this.ticker[tempName].last*100000000)/100000000
}) // push
} // for
} // if cryptoselected
if(this.regSelected){
//convert currency to currency
for (var i = 0; i<= this.currencies.length -1 ; i++){
var tempName = this.currencies[i] as string;
this.coinResults.push({
name: this.convertName(tempName as string),
amount: Math.round(this.holdings / this.currencyExchange[this.convertName(this.step2Selection)] * this.currencyExchange[tempName]*100)/100
}) // push
} // for
//convert currency to crypto
for(var i = 0 ; i <= this.coins.length - 1; i++){
var tempName = this.coins[i] as string;
this.coinResults.push({
name: this.convertName(tempName as string),
amount: Math.round(this.holdings / this.currencyExchange[this.convertName(this.step2Selection)] / this.ticker['USDT_BTC'].last / this.ticker[tempName].last*100000000)/100000000
}); //push
} // for
}// if
this.afterCoinResults = this.coinResults;
if(this.holdings){
console.log("after " + this.afterCoinResults[0].amount);
}
}// end convert