Handlebars模板,使用字符串键访问上下文变量

Handlebars templates, access context variables with a string key

本文关键字:访问 上下文 变量 字符串 模板 Handlebars      更新时间:2023-09-26

假设我有一个车把模板,如下所示:

      <script id="entry-template" type="text/x-handlebars-template">
       <div class="entry">
          <h1>{{i18n.title}}</h1>
       </div>
      </script>

我真正想做的是这样的事情:

var source   = $("#entry-template").html();
var template = Handlebars.compile(source);
var context = {"title.t":"My New Post"}
console.log(template(context));

当我试图在上面这样的上下文中以字符串作为键进行解析时,hanslebars的行为就像该键不可用一样。我确实理解正常情况下的结构应该是这样的:

var context = {
    i18n:{
      title:'test'
    }
}

但因为我将从外部源获取118n个字符串,所以将它们用作键会更容易。啊,是的,我知道像i18n.js这样的项目,但实际的问题是:我可以在上下文对象中使用带点的字符串键吗?如果可以,我如何从handlebars模板访问它们?

老问题,但我仍然想公布我的发现。

如果key:value对的键表示为字符串,则可以将字符串本身放置在手把模板占位符中。

因此,如果您的上下文是:

var context = {
    "key":"value"
}

与此相反:

var context = {
    key: "value"
}

你可以在你的模板中这样做来显示价值:

<p>{{"key"}}</p>

因此,handlers会将其视为属性名称,并显示值。

示例:

var names = {
    "first": "John",
    "last": "Doe"
}
<script id="names-template" type="text/x-handlebars-template">
<p>First Name: {{"first"}}</p>
</script>

将输出:

名字:John

我们测试了它,它尊重密钥字符串中的空格和其他字符,它也适用于字符串中的点。试试看,让我知道。

否,不能使用带点的键。这是因为它们是语法的一部分。如果你可以使用点,那么你将如何访问该元素的子元素?使用下划线或短划线代替点。这是人们尊重的标准,因为它不会引入bug和其他奇怪的行为。