如何在不序列化模型的情况下呈现模板数据?

How can I render template data without serializing the model?

本文关键字：数据 情况下 序列化 模型      更新时间：2023-09-26

这就是我目前的做法，但我想做的是从模板中呈现数据，而不需要这样做(serialized_model.items[0]): 

template: function(serialized_model){
        var user_data_tmpl = $("#user-data-template").html();
        var template = Handlebars.compile(user_data_tmpl);
        return template(serialized_model.items[0]);
    }

我得到的结果很好，但这是完整的代码:

模型&收藏:

window.UserData = {};
UserData.Model = Backbone.Model.extend();
UserData.Collection = Backbone.Collection.extend({
    model:UserData.Model,
    url: '/getUserData',
    parse: function(response) {
        return response.data;
    }
});

The View: 

UserData.View = Backbone.Marionette.ItemView.extend({
   template: function(serialized_model){
        var user_data_tmpl = $("#user-data-template").html();
        var template = Handlebars.compile(user_data_tmpl);
        return template(serialized_model.items[0]);
    }
});

模板:

<script id='user-data-template' type='text/x-handlebars-template'>
    <a href="#" id="logout"> Logout </a>
    uid:{{uid}} username:{{username}} clave:{{clave}}
</script>
JSON: 

{"success":true,"data":{"logged":true,"uid":14,"clave":14,"depto":9,"nivel":5},"report":null}

我们在代码库中处理这个问题的方式是简单地有一个BaseView类，我们所有的视图都是从它扩展的。这个视图有一个renderTemplate方法和一些支持方法，如下所示:

renderTemplate: function() {
    this.$el.html(this.templatedHtml());
    return this;
},
templatedHtml: function() {
    return this.template(this.getTemplateData());
},
getTemplateData: function() {
    return _({}).extend(this.model.toJSON());
}

我们的稍微复杂一点，但希望你能理解。关键是，如果您在BaseView类上构建自己的renderTemplate方法，那么您可以创建新的视图…

var YourView = BaseView.extend({
    template: yourCompiledTemplate
});
var yourViewInstance = new YourView({model: someModel});
// Apply template to yourViewInstance:
yourViewInstance.renderTemplate();

:

  • 一切自动发生
  • 你不需要重复任何内容
  • 如果您想添加更多(例如。你希望能够将模板定义为字符串，或者你想在脚本标签中定义它们并指定这些标签的ID，然后让视图将其编译到Handlebars模板中(为您)添加
    • 非常容易
相关文章：