Looking at your codepen, it isn't entirely clear how you want this to work, but it certainly can be made to work. Just as a quick demo, I moved your $.getJSON
inside your init
function so that it can actually have access to the view model and then in the callback set what you are getting to the property self.tracks
. Since you were binding "tracks", I changed "title" to "tracks", but you can obviously do whatever makes sense to you:
$.getJSON('http://api.soundcloud.com/users/guy-j/tracks.json?client_id=YOUR_CLIENT_ID', {limit: 200}, function(data) {
vm.tracks($.map(data, function (track) {
return {
artwork: track.artwork_url,
duration: track.duration,
permalink: track.permalink_url,
listens: track.playback_count,
stream: track.stream_url,
track: track.title
};
}));
});