Backbone.js 将数据绑定到主干中的DOM

这是我的Backbone.js：

(function() {
    window.App = {
        Models: {},
        Collections: {},
        Views: {},
        Router: {}
    };

    window.template = function(id) {
        return _.template( $('#' + id).html() );
    };

    var vent = _.extend({}, Backbone.Events);

    App.Router = Backbone.Router.extend({
        routes: {
            '' : 'index',
            '*other' : 'other'
        },
        index: function() {

        },
        other: function() {

        }
    });


    App.Models.Main = Backbone.Model.extend({
        defaults : {
            FName: ''
        }
    });

    App.Collections.Mains = Backbone.Collection.extend({
        model: App.Models.Main,
        initialize: function() {
            this.fetch({
                success: function(data) {
                    console.log(data.models);
                }
            });
        },
        url: '../leads/main_contact'
    });

    App.Views.Mains = Backbone.View.extend({
        tagName: 'ul',
        initialize: function() {
            this.collection.on('reset', this.render, this);
            console.log(this.collection);
        },
        render: function() {
            return this.collection.each(this.addOne, this);
        },
        addOne: function(main) {
            var mainC = new App.Views.Main({ model: main});
            this.$el.append(mainC.render().el);
            return this;
        }
    });

    App.Views.Main = Backbone.View.extend({
        tagName: 'li',
        template: template('mainContactTemplate'),
        render: function () {
            this.$el.html(this.template(this.model.toJSON()));
            return this;
        }

    });

    mains = new App.Collections.Mains();
    main = new App.Views.Main({ collection: mains});

    new App.Router;
    Backbone.history.start();
})();

---

我想做的是将

ul

中返回的数据绑定到名为

$（“#web leads'）

的DOM元素。考虑到这个代码，我该怎么做？顺便说一句，我已经发布了关于这一点，并试图遵循第一个答案和第二个答案的组合。但是我仍然没有将HTML和数据绑定到DOM。我收集的数据正确地从服务器返回，所以我知道这不是问题所在。别担心路由器的事。以后再说。

通常在主干中，您不会将数据放在DOM元素上：您将数据放在包装该DOM元素的视图中

也就是说，如果您真的想在元素上存储数据，jQuery有一个函数：

$('#web-leads').data('someKey', 'yourData');

然后，您可以使用以下方法检索该数据：

$('#web-leads').data('someKey');

*编辑*

在与OP的评论讨论中，很明显，真正的目标只是将视图的元素附加到页面上的元素。如果要附加到的元素是

#web leads

，则可以通过以下方式实现：

$('#web-leads').append(theView.render().el);

---

我的数据是我的HTML。如何将我的HTML绑定到DOM元素？我正在尝试将数据绑定到HTML模板，然后将其返回到DOM。我仍然对您试图实现的目标感到困惑。当你这么说的时候，你是指这行

this.el.html（this.template（this.model.toJSON（））？因为这是将数据（this.model）绑定到模板，然后（通过
.html（）
）将其放入DOM。那么为什么它不显示在页面上呢？我想我需要告诉BB在DOM中放置它的位置，而不是
ul li
。您有两个
App.Views.Main
s；第一个是完全没有意义的，因为它只是被第二个覆盖了。一个是
App.Views.Main
，是li的视图。另一个是
App.Views.Mains
，是收藏的视图。哎呀，我没读到：-）没问题。这发生在我们最好的人身上。