我不明白，为什么我的 CalculateTotal () function 返回“Null”？

Question

我正在尝试创建一个服装销售网站，我在 function 计算本地存储级别的购物车中存在的产品总数，但我的 function 返回“null”我真的需要帮助...

这是代码：

constructor(private productService: ProductService,
          private orderService: OrderService,
          private httpClient: HttpClient,
          private router: Router,
          private spinner: NgxSpinnerService,
          private toast: ToastrService) {

this.cartTotal$.next(this.cartDataServer.total);
this.cartDataObs$.next(this.cartDataServer);

let info: CartModelPublic = JSON.parse(localStorage.getItem('cart')!);

if (info !== null && info !== undefined && info.prodData[0].incart !== 0) {
  // assign the value to our data variable which corresponds to the LocalStorage data format
  this.cartDataClient = info;
  // Loop through each entry and put it in the cartDataServer object
  this.cartDataClient.prodData.forEach(p => {
    this.productService.getSingleProduct(p.id).subscribe((actualProdInfo: ProductModelServer) => {
      if (this.cartDataServer.data[0].numInCart === 0) {
        this.cartDataServer.data[0].numInCart = p.incart;
        this.cartDataServer.data[0].product = actualProdInfo;
        this.CalculateTotal();
        this.cartDataClient.total = this.cartDataServer.total;
        localStorage.setItem('cart', JSON.stringify(this.cartDataClient));
      } else {
        this.cartDataServer.data.push({
          numInCart: p.incart,
          product: actualProdInfo
        });
        this.CalculateTotal();
        this.cartDataClient.total = this.cartDataServer.total;
        localStorage.setItem('cart', JSON.stringify(this.cartDataClient));
      }
      this.cartDataObs$.next({...this.cartDataServer});
    });
  });
}

}

AddProductToCart(id: number, quantity?: number) {

this.productService.getSingleProduct(id).subscribe(prod => {
  // If the cart is empty
  if (this.cartDataServer.data[0].product === undefined) {
    this.cartDataServer.data[0].product = prod;
    this.cartDataServer.data[0].numInCart = quantity !== undefined ? quantity : 1;
    this.CalculateTotal();
    this.cartDataClient.prodData[0].incart = this.cartDataServer.data[0].numInCart;
    this.cartDataClient.prodData[0].id = prod.id;
    this.cartDataClient.total = this.cartDataServer.total;
    localStorage.setItem('cart', JSON.stringify(this.cartDataClient));
    this.cartDataObs$.next({...this.cartDataServer});
    this.toast.success(`${prod.name} added to the cart.`, "Product Added", {
      timeOut: 1500,
      progressBar: true,
      progressAnimation: 'increasing',
      positionClass: 'toast-top-right'
    })
  }  // END of IF
  // Cart is not empty
  else {
    let index = this.cartDataServer.data.findIndex(p => p.product.id === prod.id);

    // 1. If chosen product is already in cart array
    if (index !== -1) {

      if (quantity !== undefined && quantity <= prod.quantity) {
        // @ts-ignore
        this.cartDataServer.data[index].numInCart = this.cartDataServer.data[index].numInCart < prod.quantity ? quantity : prod.quantity;
      } else {
        // @ts-ignore
        this.cartDataServer.data[index].numInCart < prod.quantity ? this.cartDataServer.data[index].numInCart++ : prod.quantity;
      }


      this.cartDataClient.prodData[index].incart = this.cartDataServer.data[index].numInCart;
      this.toast.info(`${prod.name} quantity updated in the cart.`, "Product Updated", {
        timeOut: 1500,
        progressBar: true,
        progressAnimation: 'increasing',
        positionClass: 'toast-top-right'
      })
    }
    // 2. If chosen product is not in cart array
    else {
      this.cartDataServer.data.push({
        product: prod,
        numInCart: 1
      });
      this.cartDataClient.prodData.push({
        incart: 1,
        id: prod.id
      });
      this.toast.success(`${prod.name} added to the cart.`, "Product Added", {
        timeOut: 1500,
        progressBar: true,
        progressAnimation: 'increasing',
        positionClass: 'toast-top-right'
      })
    }
    this.CalculateTotal();
    this.cartDataClient.total = this.cartDataServer.total;
    localStorage.setItem('cart', JSON.stringify(this.cartDataClient));
    this.cartDataObs$.next({...this.cartDataServer});
  }  // END of ELSE


});

}

这是我的CalculateTotal() function：

  private CalculateTotal() {
    let Total = 0;

    this.cartDataServer.data.forEach(p => {
      const {numInCart} = p;
      const {price} = p.product;
      // @ts-ignore
      Total += numInCart * price;
    });
    this.cartDataServer.total = Total;
    this.cartTotal$.next(this.cartDataServer.total);
  }

这是控制台中的结果：

Answer 1

我认为这是因为你的const {numInCart} = p; 在private CalculateTotal()中有一个object值

尝试改变const {numInCart} = p; 到const {numInCart} = p.numInCart;