amplitudejs
amplitudejs copied to clipboard
Adding a list of songs dynamically does not show all meta information like name
Issue description
After init of AmplitudeJS
Amplitude.init({contains a list of songs});
I read the list of songs with
Amplitude.getSongs()
and dynamically add a HTML list with:
let list = document.getElementById('list');
let i = 0;
songs.forEach(function(song) {
list.insertAdjacentHTML('beforeend', getPlaylistItem(song, i++));
});
getPlaylistItem() looks like this simplified:
function getPlaylistItem(song, index) {
return '<div class="song amplitude-song-container amplitude-play-pause" data-amplitude-song-index="' + index + '">'
+ '<div class="song-meta-container">'
+ '<span class="song-name" data-amplitude-song-info="name" data-amplitude-song-index="' + index + '"></span>'
+ '</div>'
+ '</div>'
;
}
After that is finished I call
Amplitude.bindNewElements();
which successfully adds listeners to the new HTML. I can click the list items to play and pause songs. What does not work, is displaying the song name.
I tried with a static version where the HTML is hard-coded. There it works fine.
Environment
I tested with Chromium 76.0 Firefox 68.0
- Amplitude.js Version:
Amplitude.getVersion() "5.0.2"
A screenshot of my rendered list without the name:
Thank you for your outstanding work! I´d be really great if you could look into this.