jsViews / jsRender vs 模板内的丰富表达式
jsViews / jsRender vs rich expressions inside template
小问题: 我正在使用 jsViews 呈现 HTML 模板。我想要某种翻译。现在我的应用程序 returns 全局变量 "language" 的值等于: pl || zh || 德。
如何使用全局变量"language"减少负责翻译的JSON中的数据?
1). JSON数据
var language = [
{
"pl": {
"prop": "value",
"prop": "value"
},
"en": {
"prop": "value",
"prop": "value"
},
"de": {
"prop": "value",
"prop": "value"
}
}
];
2).工作 HTML 模板,但语言值是静态写入的
<script type="text/x-jsrender" id="test">
<div>
{{props pl}}
<span>
{{>prop}}
</span>
{{/props}}
</div>
</script>
3).我想将 {{props pl}} 更改为类似 {{props *language}} 的内容以在模板中动态获取语言,但如何正确编写?
我知道:
a). $.views.settings.allowCode= true;
b). {{*:language}} will return language shortcode
那么如何在 {{if}} 或 {{props}} 或 {{for}} 中使用这个表达式呢??
提前致谢!!
使用 allowCode = true
最适用于您希望为无法以声明方式实现的操作包含代码的情况。
您可以混合使用代码和常规标签,如此处示例所示:http://www.jsviews.com/#allowcodetag;
但是避免使用 allowCode 会提供更好的可维护性和代码分离。
如果在这种情况下,如果您只想访问全局变量,则可以简单地将它们传入或声明为助手:http://www.jsviews.com/#helpers.
例如你可以这样做:
<input data-link="~options.language" />
<div>
{^{props words[~options.language]}}
<span>
{{>prop}}
</span>
{{/props}}
</div>
和
var data = {
words: {
en: {
prop: "value",
prop: "value"
},
de: {
...
}};
$.templates("#test").link('#container', data, {options: {language: "en"}});
现在,如果您更改输入中的语言,道具显示将切换为新语言。
小问题: 我正在使用 jsViews 呈现 HTML 模板。我想要某种翻译。现在我的应用程序 returns 全局变量 "language" 的值等于: pl || zh || 德。
如何使用全局变量"language"减少负责翻译的JSON中的数据?
1). JSON数据
var language = [
{
"pl": {
"prop": "value",
"prop": "value"
},
"en": {
"prop": "value",
"prop": "value"
},
"de": {
"prop": "value",
"prop": "value"
}
}
];
2).工作 HTML 模板,但语言值是静态写入的
<script type="text/x-jsrender" id="test">
<div>
{{props pl}}
<span>
{{>prop}}
</span>
{{/props}}
</div>
</script>
3).我想将 {{props pl}} 更改为类似 {{props *language}} 的内容以在模板中动态获取语言,但如何正确编写?
我知道:
a). $.views.settings.allowCode= true;
b). {{*:language}} will return language shortcode
那么如何在 {{if}} 或 {{props}} 或 {{for}} 中使用这个表达式呢??
提前致谢!!
使用 allowCode = true
最适用于您希望为无法以声明方式实现的操作包含代码的情况。
您可以混合使用代码和常规标签,如此处示例所示:http://www.jsviews.com/#allowcodetag;
但是避免使用 allowCode 会提供更好的可维护性和代码分离。
如果在这种情况下,如果您只想访问全局变量,则可以简单地将它们传入或声明为助手:http://www.jsviews.com/#helpers.
例如你可以这样做:
<input data-link="~options.language" />
<div>
{^{props words[~options.language]}}
<span>
{{>prop}}
</span>
{{/props}}
</div>
和
var data = {
words: {
en: {
prop: "value",
prop: "value"
},
de: {
...
}};
$.templates("#test").link('#container', data, {options: {language: "en"}});
现在,如果您更改输入中的语言,道具显示将切换为新语言。