Question

我有一个JSON文件，我需要使用HandlebarsJS在我的Backbone App上显示，但我不确定如何实现这一点。

以下是我的JSON文件的结构：

data: {title:Win special things, startDate:null, endDate:2014-08-04T10:00:00.000Z,privacy:public,…}
  contest_id: 11
  endDate: "2014-08-04T10:00:00.000Z"
  privacy: "public"
  question: {title:When was "The Black Album" released?, question_id:11,…}
     answers: [{answer_id:16, answer:1992, correct:false, createdAt:2014-06-23T08:09:17.000Z,…},…]
           0: {answer_id:16, answer:1992, correct:false, createdAt:2014-06-23T08:09:17.000Z,…}
           1: {answer_id:17, answer:1993, correct:false, createdAt:2014-06-23T08:09:17.000Z,…}
           2: {answer_id:18, answer:1991, correct:true, createdAt:2014-06-23T08:09:17.000Z,…}
           3: {answer_id:19, answer:1990, correct:false, createdAt:2014-06-23T08:09:17.000Z,…}
              answer: "1990"
              answer_id: 19
              contest_questionId: 11
              correct: false
              createdAt: "2014-06-23T08:09:17.000Z"
              updatedAt: "2014-06-23T08:09:17.000Z"
      question_id: 11
      title: "When was "The Black Album" released?"
  startDate: null
  status: "editing"
  title: "Win special things"

我试着这样做：

SingleCompetition.SingleCompetitionCollection = Backbone.Collection.extend({
    url: function() {
        return App.APIO + '/i/contest/' + 11;  // *('11' is the id of the contest)*
    }
});

但是当我在singleCompetitionCollection.fetch()之后调试集合时，它告诉我undefined并且它什么也没有返回。

我该怎么做？

更新

好的，改成：

SingleCompetition.SingleCompetitionModel = Backbone.Model.extend({
    url: function() {
        return App.APIO + '/i/contests';
    },

    defaults: {
        "data": []
    }
});

和我的HandlebarsJS HTML看起来像（只是一点点，就像例子一样）：

 {{#each this}}
  <li>
     <h2>{{title}}</h2>
 </li>  
{{/each}}

它显示<h2>为空。控制台告诉我数据JSON是可用的，所以我认为，我认为，可能会出现什么问题？

Answer 1

试试这个

SingleCompetition.SingleCompetitionCollection = Backbone.Collection.extend({
            model: SingleCompetition.SingleCompetitionModel,
            url: json_url_here,

            initialize: function() {
                this.fetch({ type:"GET" }).error(function(){
                    console.error("error");
                });
            }
        });

Answer 2

我自己修理了这个：

{{#each data}}
<li>
  <h2>{{title}}</h2>
</li>  
{{/each}}

现在显示我想要的内容！

感谢您的帮助！

BackboneJS - 如何从JSON文件创建模型和/或集合

2 个答案: