Question

工作

我创建了一个使用underscore.js

显示模板中值的简单示例

现在我想创建一个使用模型事物

在模板中显示用户值的高级示例

enter image description here

现在我的模型是（EditProfileModel.js）：

window.EditProfileModel = Backbone.Model.extend({

constructor : function(attributes, options) {
    Backbone.Model.apply(this, arguments);
},
defaults : {
    id : '',
    firstName : '',
    lastName : '',
},
urlRoot: 'rest/editProfile'
});

EditProfileView.js：

window.EditProfileView = Backbone.View.extend({

template : 'tpl/EditProfileTpl.html',
el: content,

initialize:function () {
    this.render();
},

events: {

},

render:function () {
    var $this = this;

    var editProfileModel = new EditProfileModel({   
        id:this.model.get('id')
    });

    //GET editProfile/id
    editProfileModel.fetch({
        success : function(model){
            //console.log("I am fetch " + JSON.stringify(model));

            TemplateManager.get($this.template, function(template){

                console.log($(template).html());
                var html = _.template($(template).html(),{user : model});

                $this.$el.html(html);


                return $this;
            });
        }
    });
},

});

和带路由器的main.js是：

.....
routes : {
    "profile/:id" : "editProfile"
},

editProfile : function(id){

    var $this = this;

    $this.model = new EditProfileModel({
        id:id
    });

    $('#content').html(
        new EditProfileView({
            model: $this.model
        })
    );
}


......

TemplateManager只是一个javascript代码，可以根据需要获取模板并将其存储在数组中，并在第二次从内存中请求时返回相同的模板。（我得到了代码here）< / em>的

但它显示如下：

（请参阅文本框值，它应该是 admin ，因为它是从服务器返回的）

请帮助我，这真的很奇怪..................

：（

这是来自服务器（模板）:::
的html
<div> <form id="frmEditProfile" class="form-horizontal"> <div class="control-group"> <label class="control-label" for="firstName">FirstName</label> <div class="controls"> <input id="firstName" name="firstName" placeholder="firstName" value="<%=model.get('firstName')%>" autofocus="autofocus"> </div> </div> <div class="control-group"> <label class="control-label" for="lastName">LastName</label> <div class="controls"> <input type="text" id="lastName" name="lastName" placeholder="lastName"> </div> </div> <input type="hidden" name="id" value=""> <div class="control-group"> <div class="controls"> <button class="btn btn-primary" id="btnSave" type="submit"> <i class="icon-ok"></i> Save </button> </div> </div> </form> </div>

Answer 1

TemplateManager？您是否在发布的链接中看到，Derrick提到这是一个坏主意？

无论如何：你记录了$ template.html（），你只需要记录模型，然后你应该能够看到控制台出了什么问题。

Answer 2

尝试解码从TemplateManager返回的HTML实体。

var data = model.toJSON();
var tmpl = $("<div />").html($(template).html()).text();
var html = _.template(tmpl, {firstName: data.firstName});

同时将模板更改为：

<input id="firstName" name="firstName" placeholder="firstName" 
    value="<%= firstName %>" autofocus="autofocus">...

模板在Backbone.js中不起作用

2 个答案: