Rendering a CollectionView - backbone.js

Question

This question has been asked at length yet I can't seem to get any of the examples to fit my code. My model and collection populate and I get output from the console, but can;t seem to get the AppView.render to do anything other then print 'rendering view...'
var Foodtruck = Backbone.Model.extend({
defaults: {
'name': '',
'twitter': '',
'categories': [],
'coordinates': {
'latitude': 0,
'longitude': 0
}
}
});
var FoodTruckCollection = Backbone.Collection.extend({
model: Foodtruck,
url: 'http://api.mobilefeast.info/foodtrucks',
initialize: function(){
this.bind("render", function( model ){
alert("hey");
view.render( model );
})
},
parse: function(response) {
return response;
},
getData: function(){
var that = this;
that.fetch(
{
success: function () {
console.log('Data is fetched');
},
error: function() {
console.log('Failed to fetch!');
}
});
}
});
var AppView = Backbone.View.extend({
el:$('#container'),
initialize: function(){
console.log('initialize AppView');
this.foodtrucks = new FoodTruckCollection();
this.foodtrucks.getData();
},
render: function(){
console.log('rendering view...');
this.foodtrucks.each(function(model){
console.log(JSON.stringify(model));
});
}
});
new AppView().render();
tried this question: fetch after render
but no luck
Update
var AppView = Backbone.View.extend({
el:$('#container'),
initialize: function(){
console.log('Initialize');
this.foodtrucks = new FoodTruckCollection();
this.foodtrucks.fetch(
{
success: function () {
console.log('Data is fetched');
},
error: function() {
console.log('Failed to fetch!');
}
});
this.listenTo(this.foodtrucks, 'sync', this.render);
},
render: function(){
console.log('Rendering');
this.foodtrucks.each(function(model){
console.log(model.toJSON().name);
});
}
});