Backbone / Underscore / JSON渲染问题

时间:2014-03-30 20:32:53

标签: javascript json backbone.js underscore.js underscore.js-templating

试图绕过backbone.js,但我遇到了一个绊脚石,因为我的测试代码不会显示任何内容。这包括我的console.log。 该页面能够读取json / js文件并且不会产生任何错误我只是没有任何错误。什么都没有调试很难!! 我可以处理的错误。

这是我的完整代码(暂时内联)

(function(){        

    var NewsModel  = Backbone.Model.extend();

    var NewsCollection  = Backbone.Collection.extend({
        model: NewsModel,
        url : 'newsFeed.js'
    });

    var newsList = new NewsCollection ();
    newsList.fetch();
    newsList.bind('reset', function () { console.log(newsList); });

    var NewsView = Backbone.View.extend({
        el : '.newsContainer ul',
        template: _.template($('#NewsTemplate').html()),
    initialize : function() {
    this.render();
    this.model.on('change', this.render, this);
},
         render : function(eventName) {
    $(this.el).html(this.template(this.model.toJSON()));
    return this;
}
    });   }());

我使用谷歌硬盘作为试验场;完整的HTML /代码的链接。 https://docs.google.com/file/d/0B0mP2FImEQ6qa3hFTG1YUXpQQm8/edit [代码视图] https://googledrive.com/host/0B0mP2FImEQ6qUnFrU3lGcEplb2s/news.html [浏览器视图]

任何帮助将不胜感激。我希望当我遇到这个障碍时,我会没事的。)

2 个答案:

答案 0 :(得分:1)

此处的问题是数据源的格式。你应该只是为了你想要做的事情而返回条目。

[
    { title: 'first', content: 'blah' },
    { title: 'second', content: 'meh' }
]

nomsayin?

或者您可以像以下一样使用解析:

url: 'newsFeed.js',
parse: function(response) {
   return response.responseData.feed.entries;
}

答案 1 :(得分:0)

我在html code

中发现了两个问题
    在javascript中未正确引用
  1. newsContainer。您将其引用为newsConatiner,请注意拼写错误。

  2. feed: feed.models替换为以下行中的feed: feed.toJSON()

    var template = _.template($("#feedTemp").html(), { feed: feed.models });
    
  3. 请告诉我这是否有帮助!