0

嗨,我正在努力理解我将如何执行以下操作。

我有一个要渲染的主干视图,然后我想向该视图中的 dom 元素添加另一个视图。

这是我的代码:

define([
  'jquery',
  'underscore',
  'backbone',
  'views/common/parent',
  'text!templates/currentAccounts.html',
  'text!templates/guidesTools.html'
], function($, _, Backbone, ParentView, mainTemplate, subTemplate){

var accountsView = ParentView.extend({
    render : function() {
        this.$el.html(mainTemplate);
    }
});

return new accountsView;

});

我现在需要将子模板 (guidesTolls.html) 附加到主模板中的 dom 元素。最好的方法是什么?

4

1 回答 1

1

请尝试从http://backbonejs.org/#examples-todos学习示例

这部分有两个模型和三个视图

  • 型号/系列
    • 待办事项模型
    • TodoList 集合
  • 意见
    • 待办事项视图
    • 待办事项列表视图
    • 应用视图

App View 渲染一个基于 TodoList View 的视图,它渲染每个 Todo 对象的 Todo View。

你的情况比这更简单。具体来说,您可以做这样的事情来获得带有子视图的视图

<div id="main">
</div>
<script type="text/template" id="main-template">
    <h3>main view</h3>
    <ul>
      <li><%= account.id %></li>
      <li><%= account.name %></li>
    <ul>
    <div id="guide-tools"></div>
</script>

Javascript:

var accountsView = ParentView.extend({
    el: $("#main")
    render : function() {
        var template = _.template($("#main-template").html());
        var guideTemplate = "Guide Tool Text";
        this.$el.html(template(this.model.toJSON()));
        this.$("#guide-tools").html(guideTemplate);  // will insert the guide page to the #main div
    }
})

注意:我不知道如何从 html 文件中获取文本,尤其是在您使用服务器端脚本的情况下。

于 2013-02-26T09:48:13.017 回答