0

已经详细询问了这个问题,但我似乎无法找到任何适合我的代码的示例。我的模型和集合填充,我从控制台获得输出,但似乎无法让 AppView.render 执行任何其他操作,然后打印“渲染视图...”

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

0 回答 0