使用带有外部JSON的Handlebars模板

Question

我觉得真的很蠢,但我无法弄清楚这一点.我正在尝试Handlebars.js,但我不能让它显示来自Twitter API的数据.这是我得到的:

$.ajax({
  url : 'http://twitter.com/statuses/user_timeline/alexlande.json',
  dataType : 'jsonp',
  success : function( tweets ) {

    var source = $('#tweet-template').html();
    var template = Handlebars.compile(source);
    var context = tweets;

    $('#container').html(template(context));
  }
});

这不会在我的模板中显示任何内容,但以下代码按预期工作:

var source = $('#tweet-template').html();
var template = Handlebars.compile(source);
var context = { tweets : [
  { text : "This is a test tweet" },
  { text : "And this is yet another" },
  { text : "And you always need three test tweets, right?" }
]};

$('#container').html(template(context));

这很简单,我不理解,对吧？

Answer 1

在这里,您将一个Object传递给模板函数.

var context = { tweets : [
  { text : "This is a test tweet" },
  { text : "And this is yet another" },
  { text : "And you always need three test tweets, right?" }
]};

$('#container').html(template(context));

但是在不起作用的代码中:

 success : function( tweets ) {

    var source = $('#tweet-template').html();
    var template = Handlebars.compile(source);
    var context = tweets;

    $('#container').html(template(context));
  }

这"推特"变量不是一个对象,它的数组.

我认为这就是你做错了.试试这个:

 success : function( tweets ) {

    var source = $('#tweet-template').html();
    var template = Handlebars.compile(source);
    var context = tweets;

    $('#container').html(template({tweets:context}));//wrap in an Object.
  }

发布模板也可以提供更多帮助.