Question

当我尝试加载widget.tpl时，这是我简单的BackboneView。但是模板var包含一个函数（）

我做错了什么？

define(['hbs!templates/widget'],function (template) {
var template = Handlebars.compile( template );
console.log(template);

MyView = Backbone.View.extend({
    initialize: function(){
        this.render();
    },
    render: function(){
        // Compile the template using Handlebars

       console.log(template);
        //this.el.html( template );
    }
});
    return MyView;
});

widget.tpl有

<div>helloworld</div>

Answer 1

小心不要重新定义template变量。 hbs插件返回已编译的Handlebars函数as you can see in the docs。它可能会更好：

define(['hbs!templates/widget'],function (template) {
    console.log(template); // -> logs compiled Handlebars template function

    var MyView = Backbone.View.extend({
        render: function(){
            // Compile the template using Handlebars
            this.$el.append(template());
            return this;
        }
    });
    return MyView;
});

此外，您可能不希望在初始化中呈现视图。初始化应该只设置您的视图;初始化内的渲染在创建实例时会引入不必要的副作用。你的代码中的其他地方你会有这个：

var MyView = require('MyView');
var view = new MyView();
$('body').append(view.render().el);

backbone handlebars和requirejs：handlebars返回一个函数而不是html

1 个答案: