骨干模型不允许我获取数据

时间:2012-11-15 11:24:30

标签: javascript backbone.js backbone-views

我是Backbone的新手,正在做一个简单的教程。我一直遇到一个我不理解的错误。这是我的代码。

(function($) {
    dataModel = new Backbone.Model.extend({
        data: [
        {text: "Google", href: "www.google.com"},
        {text: "Yahoo", href: "www.yahoo.com"},
        {text: "Youtube", href: "www.youtube.com"},
        ]
    });

var View = Backbone.View.extend({
    initialize: function(){
        this.template = $('#list-template').children();
    },
    el: $('#container'),
    events: {
        "click button": "render"
    },
    render: function(){
        var data = this.model.get('data');
        for(var i = 0, l = data.length; i < l; i++){
            var li = this.template.clone().find('a').attr('href', data[i].href).text(data[i].text).end();
            this.el.find('ul').append(li);
        }
    }
});

var view = new View({ model: dataModel });
})(jQuery);

当我致电this.model.get('data')时,我收到错误TypeError: Object function (){return a.apply(this,arguments)} has no method 'get'。请告诉我我的错误。感谢。

3 个答案:

答案 0 :(得分:2)

扩展模型时传递的所有属性和方法都在其原型上设置而不是作为其属性,dataModel这里不是Backbone模型实例而是Backbone Model子类。如果以这种方式访问​​数据属性,则需要实例化模型并执行modelInstance.data而不是modelInstance.get('data'),就像将数据设置为模型属性一样,如示例所示下方。

你想做的是

var dataModel = new Backbone.Model({ // without the extend!
    data: [
    {text: "Google", href: "www.google.com"},
    {text: "Yahoo", href: "www.yahoo.com"},
    {text: "Youtube", href: "www.youtube.com"},
    ]
});

因为你想创建一个模型的实例,而不是Subbone.Model类的子类。 Extend方法用于子类核心Backbone类 - 视图,模型,集合和路由器。

答案 1 :(得分:0)

您的'dataModel'只是模型的定义。当您将视图传递给视图时,需要通过调用new dataModel()来创建模型实例。

答案 2 :(得分:0)

模型只定义一个数据元素的结构

Model
    defaults:
       text : null
       href : null

你需要的是一个集合

Collection
    model : Model

然后,您可以使用.add

将数据设置到集合中
Collection.add([
    {text: "Google", href: "www.google.com"},
    {text: "Yahoo", href: "www.yahoo.com"},
    {text: "Youtube", href: "www.youtube.com"},
])

从集合中获取数据看这里 http://underscorejs.org/#collections

希望有所帮助