Не может получить данные в JS ⇐ Javascript

[Anonymous]

У меня проблемы с привлечением моих данных в JS, может ли кто -нибудь помочь мне, пожалуйста.
Итак, вот скриншот консоли: < /p>
Консоль < /p>

Код: Выделить всё

const foodContainer = document.querySelector("#food-container");

function addToeatList() {
const foodValue = document.getElementById("toeatInput").value.trim();

if (foodValue === '') {
alert("You must write something!");
return;
}

fetch(`https://api.calorieninjas.com/v1/nutrition?query=${foodValue}`, {
method: 'GET',
headers: {
'X-Api-Key': 'my api key'
}
})
.then(response => {
if (!response.ok) {
throw new Error("Network response was not ok");
}
return response.json();
})
.then(res => {
const data = res.items;
let rows = '';

data.forEach((item, index) => {
rows += `
[*]

${item.name}
Calories: ${item.calories} kcal
Protein: ${item.protein_g} g
Delete food

`;
});

foodContainer.innerHTML += rows;
})
.catch(error => {
console.error('Error:', error.message);
alert("Failed to fetch data. Please try again.");
});
}

function closeToeatList(cardId) {
const card = document.getElementById(cardId);
if (card) {
card.remove();
}
}

idk Что я сделал неправильно, и мне нужно быстро закончить свой проект, пожалуйста, кто -нибудь поможет мне исправить, спасибо.

Подробнее здесь: https://stackoverflow.com/questions/796 ... ta-into-js