Backbone.js 呈现CollectionView

这个问题已经被问了很长时间了，但我似乎无法得到任何适合我的代码的示例。我的模型和集合填充并从控制台获得输出，但可以；似乎没有让AppView.render执行任何其他操作，然后打印“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();

我试过这个问题：

但是没有运气

更新

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);
      });
    }
});

---

尝试将此添加到

AppView initialize

：

this.listenTo（this.foodtrucks，'sync'，this.render）通常你可能想听
添加
或
更改
，但对于你的情况，我认为“同步”应该没问题。这让我现在有了正确的顺序，耶。我一直在研究的下一个问题是如何将json数据呈现为附加的DOM数据。。无论如何，这里是更新后的代码：如果我理解这条神奇的线路，它是一个监听器，类似于模型监听器，在this.foodtrucks上完成获取后，调用sync。然后，我们的侦听器触发呈现调用。这是一个阻塞同步调用。。正确吗？不，
sync
只是集合或模型在将
同步
返回到数据存储时将触发的事件的名称。它与阻塞/非阻塞无关。不过，您面临的问题确实与sync/async有关。当您
fetch
您的收藏时，向服务器发出
ajax
请求。当你初始化你的视图时就会发生这种情况。现在，当您的集合仍在获取数据时，您可以直接在其上进行渲染。本讲座可能对您有所帮助：或本博客：