i got the data from this array but when i add it to the loop to show all the arrays it only show me only one array
help pleaseeee
this is the problem :
https://i.imgur.com/huAv70U.png
the function to get data from api ( the problem isnt here this works fine )
function Movie(id){
fetch(`https://api.themoviedb.org/3/movie/${id}?api_key=${apikey}`)
.then((res) => res.json())
.then((data) => {
name = data.original_title;
img = data.poster_path;
link = name.replace(/[^a-zA-Zs/ ]/g, "")
var MyArray = {'name':`${name}`, 'img':`${img}`, 'link':`/movies/${link}.html`}
console.log(MyArray)
})
.catch(err => {
console.error(err);
});
}
The Array :
var MyMovies = [
Movie(238),
Movie(899082),
Movie(899),
]
the function to display all arrays (the problem is here i think)
function LoadMovies(){
buildTable(MyMovies)
function buildTable(data){
var table = document.querySelector('#movies')
for (var i = 0; i < data.length; i++){
var row = `<img id="img" src="${"https://image.tmdb.org/t/p/w342/" + img}" alt="${name}" class="thumb" onclick="location.href='${link}';">`
table.innerHTML += row
}
}
}
the console.log
show this :
Uncaught TypeError: Cannot read properties of undefined (reading 'img')