Используйте toLocalString и уменьшите функцию вместе: toLocaleString показывает NaN на дисплее

Question

Я работаю над интернационализацией, и в настоящее время у меня есть функция:

getDisputedAmount() {
return this.compactInvoices.reduce((sum, invoice) => {
  const result = sum + parseFloat(invoice.disputedAmount || 0);
  return result;
}, 0);

}

Теперь я передаю код страны и код страны, используя сервис и используя .toLocaleString, как это:

getDisputedAmount() {
return this.compactInvoices.reduce((sum, invoice) => {
  const result = sum + parseFloat(invoice.disputedAmount || 0);
  const currencyLocale = this.UserPreferences.getCountryLocale(); //for eg --> 'de-DE'
  const currencyCode = this.UserPreferences.getCountryCode(); // 'EUR'
  return Number(result).toLocaleString(currencyLocale, {
  // style: 'currency',
    currency: currencyCode,
    minimumFractionDigits: 2
  });
}, 0);

}

Но каким-то образом использование первой функции возвращает правильный результат, но если я использую toLocaleString, он приносит NaN в пользовательском интерфейсе.Я проверил значения на вкладке источников, и последний код с toLocaleString имеет правильные числа.

Также я вызываю функцию в html, используя интерполяцию

<div class="col-140"><span class="sum-label">{{ modal.getDisputedAmount() }}</span></div>

Если я применяюНомер канала, я даже не вижу NaN, написанный в GUI, он просто пуст.

Дайте мне знать ваши предложения.

Значения в compactInvoices это число, я думаю, когда toLocaleStringзапускается в первый раз, сумма преобразуется в формат строковой валюты и при добавлении суммы (которая является строкой) к новому disputedAmount в самой функции сокращения дает NaN.Поэтому, пожалуйста, поделитесь, как использовать toLocalString и уменьшить функцию вместе.

Answer 1

Вам необходимо выполнить форматирование после вычисления суммы с помощью reduce.

getDisputedAmount() {
  const result = this.compactInvoices.reduce((sum, invoice) => {
    return sum + (parseFloat(invoice.disputedAmount) || 0);
  }, 0);
  const currencyLocale = this.UserPreferences.getCountryLocale(); //for eg --> 'de-DE'
  const currencyCode = this.UserPreferences.getCountryCode(); // 'EUR'
  return result.toLocaleString(currencyLocale, {
    // style: 'currency',
    currency: currencyCode,
    minimumFractionDigits: 2
  });
}