Backbone - View没有方法' get'

时间:2013-08-30 15:15:33

标签: javascript backbone.js

嗨,大家好!

我刚开始学习Backbone,我的第一个代码出了问题。我创建的示例代码有一个按钮,一旦单击,就会添加一段代码(View),它应该从模型中获取一些默认值。但我收到的消息是:Object function (){return i.apply(this,arguments)} has no method 'get'。这是我的代码:

  var app = {};

  // the model
  app.Answer = Backbone.Model.extend({
    defaults: {
      title: 'Your answer here',
      isAnswer: false
    }
  });

  //the collection
  app.AnswerList = Backbone.Collection.extend({
    model: app.Answer,
    localStorage: new Store("backbone-answers")
  });

  //the view that is added when the button is clicked    
  app.AnswerView = Backbone.View.extend({
    tagName: 'li',
    // template: _.template($('#answer-template').html()),
    template: _.template('<%= title %>: <%= isAnswer %>'),

    events: {
      'click button.destroy': 'remove',
    },

    initialize: function(){
      _.bindAll(this, 'render','remove');
      // this.model.bind('change', this.render());
      this.render();
    },
    render: function(){
      $(this.el).html(this.template({title: this.model.get('title'), isAnswer: this.model.get('isAnswer')}));
      return this;
    },
    remove: function(){
      $(this.el).destroy();
    }
  });

  // the main view
  app.AppView = Backbone.View.extend({
    el: $('#body'),

    events: {
      'click button#insert-button': 'addAnswer'
    },

    initialize: function(){
      _.bindAll(this, 'addAnswer');
      this.ul = $('#content');
      this.collection = new app.AnswerList();
      console.log('initialize');
    },
    addAnswer: function(){
      console.log('append');
      var newAnswer = new app.AnswerView({model: app.Answer});
      $('ul',this.el).append(newAnswer);
    }

  });

  app.appView = new app.AppView();

我是Backbone的新手,所以我的问题是:我做错了什么?

感谢您的帮助!

2 个答案:

答案 0 :(得分:1)

尝试使用此代码。 创建新视图时必须实例化模型。

var app = {};

  // the model
  app.Answer = Backbone.Model.extend({
    defaults: {
      title: 'Your answer here',
      isAnswer: false
    }
  });

  //the collection
  app.AnswerList = Backbone.Collection.extend({
    model: app.Answer,
    localStorage: new Store("backbone-answers")
  });

  //the view that is added when the button is clicked    
  app.AnswerView = Backbone.View.extend({
    tagName: 'li',
    // template: _.template($('#answer-template').html()),
    template: _.template('<%= title %>: <%= isAnswer %>'),

    events: {
      'click button.destroy': 'remove',
    },

    initialize: function(){
      _.bindAll(this, 'render','remove');
      // this.model.bind('change', this.render());
      this.render();
    },
    render: function(){
      $(this.el).html(this.template({title: this.model.get('title'), isAnswer: this.model.get('isAnswer')}));
      return this;
    },
    remove: function(){
      $(this.el).destroy();
    }
  });

  // the main view
  app.AppView = Backbone.View.extend({
    el: $('#body'),

    events: {
      'click button#insert-button': 'addAnswer'
    },

    initialize: function(){
      _.bindAll(this, 'addAnswer');
      this.ul = $('#content');
      this.collection = new app.AnswerList();
      console.log('initialize');
    },
    addAnswer: function(){
      console.log('append');
      var newAnswer = new app.AnswerView({model: new app.Answer()});
      $('ul',this.el).append(newAnswer);
    }

  });

  app.appView = new app.AppView();

答案 1 :(得分:1)

尝试

var answer = new app.Answer();
var newAnswer = new app.AnswerView({model: answer});