Jquery 主干模板入门：如何从append（）过渡到使用模板

这是一个关于如何开始使用模板的非常基本的问题。这确实是我第一次使用主干网，因此对于如何改进我的代码的任何其他建议，我都表示感谢：

例如：

对于以下代码段：

    addFurnitureLi: function (model) {
        // Add a new piece of furniture to the DOM list
        $("#furniture-list").append("<li>" + model.get('name') + "</li>");
    }

但是我不知道如何将上面的脚本模板集成到

addFurnitureLi

函数中。另外，我觉得基本上，

addFurnitureLi

函数是在页面上“呈现”HTML，所以我有另一个问题——该函数和“官方”

render

函数有什么区别

谢谢你教育我

完整的应用程序代码如下所示：

(function($) {

    Furniture = Backbone.Model.extend({
        defaults: {
            "name" : null,
            "quantity" : 1
        }
    });

    Furnitures = Backbone.Collection.extend({       
        initialize: function (models, options) {
            this.bind("add", options.view.addFurnitureLi);
            //Listen for new additions to the collection and call a view function if so
        }
    });

    FurnitureView = Backbone.View.extend({
        el: $("body"),
        initialize: function () {
            this.furnitures = new Furnitures( null, { view: this });
        },
        events: {
            "click .furniture-add":  "addFurnitureModel",
        },
        addFurnitureModel: function (ev) {
            // Add a piece of furniture to the model
            var furnitureName = $(ev.currentTarget).data('name'),
                furnitureModel = new Furniture({ name: furnitureName });

            this.furnitures.add( furnitureModel);   
        },
        addFurnitureLi: function (model) {
            // Add a new piece of furniture to the DOM list
            $("#furniture-list").append("<li>" + model.get('name') + "</li>");
        }
    });


    var furnitureView = new FurnitureView;

})(jQuery);

（函数（$）{
家具=主干.Model.extend({
默认值：{
“名称”：空，
“数量”：1
}
});
Furnitures=Backbone.Collection.extend（{
初始化：功能（模型、选项）{
this.bind（“add”，options.view.addFurnitureLi）；
//侦听集合中的新添加内容，如果是，则调用view函数
}
});
FurnitureView=Backbone.View.extend({
el:$（“正文”），
初始化：函数（）{
this.furnitures=新家具（null，{view:this}）；
},
活动：{
“单击。家具添加”：“添加家具模型”，
},
添加家具型号：功能（ev）{
//将一件家具添加到模型中
var furnitureName=$（ev.currentTarget）.data（'name'），
furnitureModel=新家具（{name:furnitureName}）；
this.furnitures.add（furnitureModel）；
},
addFurnitureLi：功能（型号）{
//将新家具添加到DOM列表中
$（“#家具清单”）.append（“
”+model.get（'name'）+“
”）；
}
});
var furnitureView=新的furnitureView；
})（jQuery）；

砰的一声沙卡·拉卡

假设模板脚本的ID是

furnitureTemplate

：

<script id="furnitureTemplate" type="text/html">

    <li>{{ name }}</li>

</script>

<script id="furnitureTemplate" type="text/html">

    <li>{{ name }}</li>

</script>

 addFurnitureLi: function (model) {
        // Add a new piece of furniture to the DOM list
        $('#furniture-list').append( ich.furnitureTemplate( model.toJSON() ) );
 }