0

我有一个在模式启动后执行的脚本。配置js对象的js是:

var source = $("#print-script").html();
var template = Handlebars.compile(source);
var data = {
    image:        image,
    title:        title,
    caption:      subtitle,
    category:     template 
};
$("#print-template").html(template(data));

所有变量都设置在对象声明之上并且正在工作。我的 html 内容如下:

<script id="print-script" type="text/x-handlebars-template">
<div class="print-only" id="print-template">
  <img src="{image}"/>
  <h2><span class="icon"></span>{category}</h2>
  <h3>{title}</h3>
  <p class="headline">{caption}</p>
  <div class="description">{long_description}</div>
</div>
</script>

我收到未捕获的类型错误:无法读取未定义的属性“图像”。我已经确认对象(数据)正在填充内容。想法?

4

2 回答 2

3

我猜问题就在这里:

var template = Handlebars.compile(source);
var data = {
    //...
    category:     template  // <------------------- oops
};

注意那里template是编译好的模板函数,所以当模板尝试填写时{category},它将执行该template函数。但是模板函数需要一些值来填充模板,然后通过调用它{category},这些值将不存在,你会得到一个 TypeError。在控制台打开的情况下运行这两个演示,您应该会看到发生了什么:

  1. 使用错误:http category: template:
    //jsfiddle.net/ambiguous/9wEyS/
  2. 作品使用category: function() { return 'string' }:http:
    //jsfiddle.net/ambiguous/YgfZx/
于 2013-10-02T02:11:12.020 回答
0

事实证明数据中需要有另一个对象:

var data = { print:{
                  image:        featuredImage,
                  title:        title,
                  caption:      subtitle,
                  category:     template 
                }
};
于 2013-10-02T02:04:49.117 回答