Question

我有一个像这样的JSon，它是一系列问题：

{
            "id": "505",
            "issuedate": "2013-01-15 06:00:00",
            "lastissueupdate": "2013-01-15 13:51:08",
            "epub": false,
            "pdf": true,
            "price": 3,
            "description": "Diese Version ist nur als PDF verfügbar.",
            "downloadable": true,
            "renderings": [
                {
                    "height": 976,
                    "width": 1024,
                    "sourcetype": "pdf",
                    "pagenr": 0,
                    "purpose": "newsstand",
                    "relativePath": null,
                    "size": 0,
                    "url": "a/url/image.jpg"
                },
                {
                    "height": 488,
                    "width": 512,
                    "sourcetype": "pdf",
                    "pagenr": 0,
                    "purpose": "newsstand",
                    "relativePath": null,
                    "size": 0,
                    "url": "a/url/image.jpg"
                }
}

我正在使用骨干，我想访问子元素（渲染）。我覆盖了解析方法，告诉我''效果图'是一个新的集合，这部分工作正常。当我在模板中传递我的问题集合时，我遇到一些问题。然后我可以针对每个问题制作一个并访问他的属性（id，issate，lastissueupdate等），但是如何访问我的问题的渲染？

我的观点：

define([
  'jquery',
  'underscore',
  'backbone',
  'text!templates/home/homeTemplate.html',
  'collections/issues/IssueCollection'
], function($, _, Backbone, homeTemplate, IssueCollection){

  var HomeView = Backbone.View.extend({
    el: $("#page"),

    initialize:function(){
      var that = this;


      var onDataHandler = function(issues){
        that.render();


      }
      this.issues = new IssueCollection();
      this.issues.fetch({
        success:onDataHandler, 
        error:function(){
          alert("nicht gut")
        }
      });
    },

    render: function(){

      $('.menu li').removeClass('active');
      $('.menu li a[href="#"]').parent().addClass('active');
      var compiledTemplate = _.template(homeTemplate, {_:_, issues: this.issues.models});
      this.$el.html(compiledTemplate);

    }

  });

  return HomeView;

});

然后我有一个非常基本的模板。

要继续，我有一个包含RENDERINGS集合的ISSUES模型ISSUES，我想在我的模板中访问模型RENDER。

编辑：的 IssueCollection

define([
    'underscore',
    'backbone',
    'models/issue/IssueModel'
], function(_, Backbone, IssueModel){

    var IssueCollection = Backbone.Collection.extend({

        model: IssueModel,

        url: function(){
            return '/padpaper-ws/v1/pp/fn/issues';
        },

        parse: function(response){
            return response.issues;
        }

        //initialize : function(models, options) {},

    });
    return IssueCollection;
});

IssueModel

define([
  'underscore',
  'backbone',
  'collections/renderings/RenderingsCollection'
], function(_, Backbone, RenderingsCollection) {

  var IssueModel = Backbone.Model.extend({
    parse: function(response){
      response.renderings = new RenderingsCollection(response.renderings);
      return response;
     },
    set: function(attributes, options) {
      if (attributes.renderings !== undefined && !(attributes.renderings instanceof RenderingsCollection)) {
        attributes.renderings = new RenderingsCollection(attributes.renderings);
      }
      return Backbone.Model.prototype.set.call(this, attributes, options);
    }
  });
  return IssueModel;
});

RenderingsCollection

define([
    'underscore',
    'backbone',
    'models/rendering/RenderingModel'
], function(_, Backbone, RenderingModel){

    var RenderingsCollection = Backbone.Collection.extend({

        model: RenderingModel

        //initialize : function(models, options) {},

    });
    return RenderingsCollection;
});

RenderingModel

define([
  'underscore',
  'backbone'
], function(_, Backbone) {

  var RenderingModel = Backbone.Model.extend({

  return RenderingModel;

});

谢谢!!

Answer 1

您可以使用Collection#toJSON方法完整表示整个数据。但是，您必须使用model.attributes.key来访问模型的属性。所以我不太推荐它。相反，我会说你应该构建自己的JSON对象（递归地使用toJSON方法）。（如果不清楚，我会用一些代码更新）

修改：

var data = [], renderings;
for(var i=0; i<issues.length; i++) {
  data.push(issues.models[i].toJSON());
  data[i].renderings = [];
  renderings = issues.models[i].get('renderings');
  for(var j=0; j<renderings.length; j++) {
    data[i].renderings.push(renderings.models[j].toJSON());
  }
}

例如，

会为您提供整个数据，您可以轻松访问任何属性。

Answer 2

实际上我可以在我的模板中使用双_.each，从视图中提供我的模型。

<% _.each(issues, function(issue) { %>
    .... code ...
    <% _.each(issue.get('renderings'), function(rendering) { %>

然后要访问我的渲染属性，我们会这样做：

<%= rendering.url %>

例如，不是第一次“得到”。

感谢您的参与！

使用Underscore和Backbone在模板中获取模型的子集合

2 个答案: