关闭模板（大豆模板）通过 Javascript 和 jQuery 呈现的问题

Question

我使用 javascript 和 jQuery 来呈现闭包模板（soy 模板）。 我正在关注它的hello world示例。
我的 jsfiddle在这里。

如示例中所述，以下代码有效，

document.write(soy.examples.simple.helloWorld());

& 提供

你好，世界！

但是当与 jQuery 一起使用动态插入闭包模板的内容时，它总是返回空，没有附加任何内容。 $('#withoutContent').append(soy.examples.simple.helloWorld());

具有讽刺意味的是，进一步观察，以下 jQuery 工作正常

$('#withContent').append(soy.examples.simple.helloWorld().content);

我在从非常旧版本的闭包模板升级时遇到了这个问题。 我们有很多这样的模板，更新每个人在 javascript 中的用法以使用.content是麻烦且容易出错的。
为什么 jQuery 不能正确获取模板的内容？？

Answer 1

为什么 jQuery 不能正确获取模板的内容？

对soy.examples.simple.helloWorld()调用返回此对象：

{
  constructor: function(){goog$soy$data$SanitizedContent.call(this)},
  content: "Hello world!",
  contentDir: null,
  contentKind: { ... },
  getContent: function(){return this.content},
  toString: function(){return this.content}
}

如您所见，它不是 HTML，它有几个属性和方法——其中之一是toString() ，它返回.content 。

document.write()需要一个字符串参数。 如果你传递其他东西（例如上面的对象），那么它会自动为你调用.toString() 。 这就是为什么

document.write(soy.examples.simple.helloWorld());

作品。

jQuery 的$.append()接受所有类型的东西——纯字符串、单个 DOM 节点、DOM 节点列表、其他 jQuery 对象、函数——并为每个参数类型做适当的事情。 但是为了换取这种灵活性，它不会简单地将其参数转换为字符串。 一些 jQuery 无法识别的随机对象将被丢弃。 这就是为什么

$('#withoutContent').append(soy.examples.simple.helloWorld());

不起作用。

更新每个人在 javascript 中的用法以使用 .content 是麻烦且容易出错的。

如果您可以在所有这些位置键入$('...').append() ，那么您就可以在所有这些位置键入.content 。