[英]Default value for a Handlebars` template placeholder
Can I specify a default value for a Handlebars` template placeholder?我可以为 Handlebars` 模板占位符指定默认值吗?
<script type="x-handlebars-template" id="menu-edit-form-tpl">
<form method="{{method}}" action="{{action}}" class="menu-edit-form">
...
</form>
</script>
Can I specify default values for {{method}} and {{action}} and skip them in the object that is passed to the compiled template?我可以为 {{method}} 和 {{action}} 指定默认值并在传递给编译模板的对象中跳过它们吗?
Handlebars has no "default values".把手没有“默认值”。
You should use {{#if}}
statement to check property is set.您应该使用{{#if}}
语句来检查属性是否设置。
<script type="x-handlebars-template" id="menu-edit-form-tpl">
<form method="{{#if method}}{{method}}{{else}}POST{{/if}}" action="{{#if action}}{{action}}{{else}}/{{/if}}" class="menu-edit-form">
...
</form>
</script>
Or if you want a bit cleaner syntax, use the simple helper:或者,如果您想要更简洁的语法,请使用简单的帮助程序:
Handlebars.registerHelper('safeVal', function (value, safeValue) {
var out = value || safeValue;
return new Handlebars.SafeString(out);
});
which allows you to write like this:它允许你这样写:
<script type="x-handlebars-template" id="menu-edit-form-tpl">
<form method="{{safeVal method 'POST'}}" action="{{safeVal action '/'}}" class="menu-edit-form">
...
</form>
</script>
Here is my simple solution这是我的简单解决方案
first we create a very basic helper called 'choose'首先,我们创建一个非常基本的帮助程序,称为“选择”
Handlebars.registerHelper('choose', function (a, b) {return a ? a : b;});
then we use it in the template :)然后我们在模板中使用它:)
<p>
{{choose valueFromData 'default-value-in-template'}}
<p>
or of course we can do或者我们当然可以
<p>
{{choose valueFromData defaultValueFromData}}
<p>
So in your case:所以在你的情况下:
<form method="{{choose method 'get'}}" action="{{choose action 'action.php'}}" class="menu-edit-form">
...
</form>
Hope it helps someone else since this is from 2014 :)希望它可以帮助其他人,因为这是 2014 年的:)
This question and its accepted answer are quite old and a lot of new features and functionality have been added to handlebars since they were written.这个问题及其被接受的答案已经很老了,并且自编写以来,许多新特性和功能已添加到车把中。
I managed to get the functionality of default values by using partial blocks which were released in v4.0.0 - so your template would end up looking like this:我设法通过使用 v4.0.0 中发布的部分块来获得默认值的功能 - 所以你的模板最终看起来像这样:
<script type="x-handlebars-template" id="menu-edit-form-tpl">
<form method="{{#> method}}get{{/method}}" action="{{#> action}}index.php{{/action}}" class="menu-edit-form">
...
</form>
</script>
Then it's just a case of passing in your method
and action
as partials by doing something like this:那么这只是通过执行以下action
将您的method
和action
作为部分传递的情况:
var source = $('#menu-edit-form-tpl').html(),
template = Handlebars.compile(source),
html = template({}, {
partials: {
action: 'contact-form.php'
}
});
In the resulting html the method will default to get
and the action will be contact-form.php
.在生成的 html 中,该方法将默认为get
并且操作将是contact-form.php
。 Here's a working demo:这是一个工作演示:
var source = $('#menu-edit-form-tpl').html(), template = Handlebars.compile(source), html = template({}, { partials: { action: 'contact-form.php' } }); // Code below here only to show output. document.write('<code>' + $("<div/>").text(html).html() + '</code>');
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script type="x-handlebars-template" id="menu-edit-form-tpl"> <form method="{{#> method}}get{{/method}}" action="{{#> action}}index.php{{/action}}" class="menu-edit-form"> ... </form> </script>
You can register a helperMissing
helper which will get called whenever a value is defined in your template, but not in your context (useful if you don't want missing values to fail silently):您可以注册一个helperMissing
助手,只要在您的模板中定义了一个值,它就会被调用,但不会在您的上下文中被调用(如果您不希望缺失值静默失败,则很有用):
Handlebars.registerHelper("helperMissing", function(context, options) {
console.error("Template defines {{" + context.name + "}}, but not provided in context");
return "{{" + context.name + "}}";
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.