Backbone:Uncaught TypeError:无法读取未定义的属性'toJSON'

时间:2016-01-12 00:21:21

标签: javascript jquery backbone.js

我收到了以下错误:“未捕获的TypeError:无法读取未定义的属性'toJSON'”

我敢打赌这是一个愚蠢的错误(被认为无助于关注我2岁的女儿和我在一起的事实),但我在这里。

这是我的代码:

(function($){


  // Model:
  //-------

  var DirectoryItem = Backbone.Model.extend({
    defaults: function(){
        title: 'New Company'
    },

    initialize: function() {
        console.log(this.get('title'));    
    }

  });

  var Company1 = new DirectoryItem({title:'Company number 1'});

  // Collection:
  //------------

  var Directory = Backbone.Collection.extend({
    model: DirectoryItem,

    initialize: function() {
      console.log('New collection created...');         
    }

  });

  var directory = new Directory(Company1);

  // View:
  //------

  var DirectoryListView = Backbone.View.extend({

    el: $("#directoryView"),

    template: _.template($('#item-list-template').html()),

    initialize: function(){
        this.render();                
    },

    render: function () {
      this.$el.html(this.template(this.model.toJSON()));
      return this;
    }

  });

  var directoryListView = new DirectoryListView();

})(jQuery);

有人可以帮助我吗?

谢谢!

PD:可能你已经注意到了,但我是Backbone的新手

编辑:作为模板我有这个:

<script type="text/template" id="item-list-template">
    <li><%= title %></li>
</script>

1 个答案:

答案 0 :(得分:1)

<强>第一即可。你在这一行上犯了一个错误:

@extends('bootstrap.layouts.master') @section('title', 'Bootstrap-About') @section('content') <nav> <li>Mamun</li> <li>Web Developer</li> <li>Bangla Trac Miaki Vas Ltd.</li> <li>Banani</li> </nav> @stop

因为var directory = new Directory(Company1);集合需要数组作为第一个参数但不是标量。所以解决以下问题:

Directory

<强>第二即可。请你var directory = new Directory([Company1]);上课:

DirectoryListView

第三。var DirectoryListView = Backbone.View.extend({ el: $("#directoryView"), template: _.template($('#item-list-template').html()), initialize: function(){ this.render(); }, render: function () { this.collection.each(function (model) { var html = this.template(model.toJSON()); this.$el.append(html); }, this); return this; } 初始化更改为以下内容:

directoryListView