Getter not returning the right values

[Maureen Moore]

I am trying to sum up all of my sub totals and return a grand total but I get wild values and I used to get the error: Expression has changed after it was checked. 

When I use 

import { ChangeDetectionStrategy } from '@angular/core';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush
})

it suppresses the expression has changed error but I still get wild values for the grand total. 

This is in my component: 

totals : number[ ] = [ ];


get grandTotal() {


let i;
let sub_total = 0;
let grand_total = 0;
sub_total = this.product_price * this.quantity;


if (typeof this.product_price  === "undefined") {
return 0;
} else {
this.totals.push(sub_total);
for (i = 0; i < this.totals.length; i++) {
 grand_total += this.totals[i];
}
return grand_total;
}
}

This is in my HTML;

<div>Grand Total {{ grandTotal }}</div>

[Maureen Moore]

I set issubmitted to true in my onSubmit function and executed if (this.isSubmited == true) in my getter but it didn't remedy the problem.

[Maureen Moore]

The first submission works but then after that the grand total updates before the form is submitted. The isSubmitted variable must have been changed to true even though the form only submitted once. How can I prevent the isSubmitted variable from remaining true?

[Maureen Moore]

I was able to fix this by setting  this.isSubmitted = false; in my getter.

[Scott Logsdon]

```

  calcGrandTotal(totals: any) {

    this.grandTotal = this.totals.reduce((acc, item: any)=> {

      return acc + item.product_qty * item.product_total;

    }, 0);

  }

```

Example Stackblitz:  https://stackblitz.com/edit/angular-ivy-zxvi5c

[Maureen Moore]

Thanks, Scott but I found a simpler solution. 

[Maureen Moore]

Hi Scott, My getter isn't working so well after all because it doesn't update the products when a product is deleted. So I re-visited my old forum posts and I came across your solution. I don't have a clear totals array in the constructor, instead I get the items by using this.items = this.getStorageItems(); in my ngOnInit function. So I modified your code and used this.items instead of this.totals but I can't get it to work; grandTotal always returns null. I see that your code is working perfectly at Stackblitz so I'm sure I'm doing something wrong. Can you help me with this?

[Maureen Moore]

I got it to work now. My items weren't being gotten in the right order in my ngOnInit function so I fixed that and everything worked. But I have the same problem as I had with my solution; after a product is deleted, the grand total doesn't update.

[Maureen Moore]

It just now stopped working. I don't think I changed anything.

[Maureen Moore]

It's not showing null any more but it's showing the wrong grand total.

[Maureen Moore]

deleteItem(i){
  this.items.splice(i,1);
  this.setStorageItems(this.items);
  }
 

In my HTML:

<tr *ngFor="let item of items; let i = index">
<td>
<button type="button" (click)="deleteItem(i)">X</button></td>
</tr>

[Maureen Moore]

I am now replying directly to your question so you can hopefully get a notification in your email. Please see my updates. I need help with this.

[Scott Logsdon]

Can you put your code in a StackBlitz where I can see it?

[Maureen Moore]

I put the code at https://angular-ivy-at2fdp.stackblitz.io/ and it's working on stackblitz now but the grand total is null on init when I look at my own program.

[Maureen Moore]

It's working for my program now. I just needed to put calcGrandTotal in my onsubmit function!

[Maureen Moore]

Thanks, Scott!

[Luis Mejias]

Try call the get in a ngAfterviewInit this error is very complicated, with changeDetection onPush should resolved but sometimes it's not possible

--
You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/angular/55064620-1287-4e67-b33c-8f9ef98e924ao%40googlegroups.com.