Проблема NaN с функцией затрат

#angular

#angular

Вопрос:

Здравствуйте, я обучал себя angular и создал простое приложение для корзины покупок. Мне удалось заменить простой массив на использование данных из API, благодаря кому-то на этом веб-сайте за помощь с заключительной частью. Я заметил проблему, как только я внес изменение, что общая стоимость корзины покупок возвращает NaN, я предполагаю, что есть проблема с чем-то, имеющим то же имя, поэтому возникает проблема, однако я, похоже, не могу ее обнаружить. буду признателен за любую помощь, и я связал свой полный проект ниже и вставил в две области, где, по моему мнению, может быть проблема. когда я регистрирую это в консоли.products, он возвращает значение undefined, поэтому я считаю, что это может быть проблемой?

Ответ №1:

Ваша цена за продукт представлена в виде строки (т.Е. «$ 4,04»). JavaScript не знает, как их объединить. Итак, чтобы получить фактическое число, вам нужно будет удалить «$» с помощью функции .substring():

   calcPrice() {
    return this.products.reduce((acc, prod) => {
      if (this.calcTotal() >= 10) {
        return (acc  = prod.price.substring(1) * prod.num * 0.5);
      } else if (this.calcTotal() >= 5) {
        return (acc  = prod.price.substring(1) * prod.num * 0.75);
      } else {
        return (acc  = prod.price.substring(1) * prod.num);
      }
    }, 0);
  }