Question

模板代码：

<script type="text/template" id="baseTemplate">
        <% collection.each(function() { %>
            <div>
                <%= collection %>
            </div>
        <% }); %>
</script>
<div id="baseContainer"></div>

和其他代码是：

//model
var PageModel = Backbone.Model.extend({
    defaults: {
        "id":null,
        "title":"",
        "content":""
    },
});
//collection
var PageCollection = Backbone.Collection.extend({
    defaults: {
        model: PageModel
    },
    model: PageModel,
    url: 'api/get_page/?id=6'
});
//view
var PageView = Backbone.View.extend({

    el: $('#baseContainer'),

    initialize: function () {
        this.collection = new PageCollection();
        this.collection.bind("reset", this.render, this);
        this.collection.bind("change", this.render, this);
        this.collection.fetch();
    },
    render: function () {

    var html = _.template($("#baseTemplate").html(), { collection: this.collection });
    this.$el.html(html);
    console.log(html);
    return this;
    }
});

 var page = new PageView();

问题是它的返回和对象如何从对象中获取值？ api链接是http://furqankhanzada.com/backbonejs/api/get_page/?id=6，在这里你可以在浏览器控制台http://furqankhanzada.com/backbonejs/中看到对象我需要获得标题，内容，附件 - ＆gt;图像 - ＆gt; Gallery Large - ＆gt; url（使用each（）的附件）。

Answer 1

不确定这是否是正确的解决方案，但你可以尝试一下。

替代方案可以是，

var html = _.template($("#baseTemplate").html(), { models: this.collection.models });

传递模型而不是直接传递集合。在模板中你可以做这样的事情，

<script type="text/template" id="baseTemplate">
  <% _.each(models, function(mdl) { %>
    <div>
      <%= mdl.get('title') %>
      <%= mdl.get('content') %>
      <% _.each(mdl.get('page').attachments, function(attachment) { %>
        <%= attachment.images["Gallery Large"].url %>
     <% }) %>  
   </div>
  <% }); %>
</script>
<div id="baseContainer"></div>

请根据您的需要修改标记。但是这个解决方案对问题太具体了:( :(

如何使用backbonejs从对象渲染视图？

1 个答案: