Backbone.js - 获取数据并显示

时间:2011-08-12 04:01:08

标签: backbone.js

我刚刚开始使用Backbone.js。这是我的代码。

$(function(){

    //Backbone Model
    var Cat = Backbone.Model.extend({});

    // create a collection
    var CatCollection = Backbone.Collection.extend({
        model: Cat,
        url: 'http://localhost/cats/index.php/cats/index'
    });
    var catCollection = new CatCollection();
    catCollection.fetch();

    // Backbone view
    var CatView = Backbone.View.extend({
        el: $("#contents"),
        initialize: function() {
            this.render();
        },
        render: function() {
            this.el.html(catCollection);
        }
    });

    var catView = new CatView();
});

我在做什么。

  1. 创建骨干模型
  2. 使用我创建的模型创建集合。
  3. 从MySQL数据库中获取数据 - 这将返回一个JSON数据对象。
  4. 在div“#contents”中显示提取的数据。
  5. 在谷歌浏览器上,我可以看到“fetch()”方法有效,因为我可以看到我的JSON对象返回为

    [{"id":"1","name":"stella","age":"5"},{"id":"2","name":"Max","age":"2"}]
    

    但如果我在获取后执行“alert(catCollection)”,则会显示“[object] [object]”。

    显示此内容的最佳方式是什么?

3 个答案:

答案 0 :(得分:3)

您应该使用JST数组中的模板。

$(this.el).html($(JST["comments/item"](model.toJSON())));

“comments \ item”是模板路径和名称 如果您正在使用Rails,只需使用Jammit并使用ERB(默认)或Jade

编写模板

答案 1 :(得分:1)

backbone.js文档举例如下:

alert(JSON.stringify(catCollection));

http://backbonejs.org/#Collection-toJSON

答案 2 :(得分:-9)

使用console.log