javascript Handlebars` 模板占位符的默认值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25603033/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Default value for a Handlebars` template placeholder
提问by MTVS
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}} 指定默认值并在传递给编译模板的对象中跳过它们吗？
回答by raidendev
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>
回答by Nick Panov
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 年的:)
回答by Andy
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 blockswhich 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 methodand actionas partials by doing something like this:
那么这只是通过执行以下操作将您的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 getand the action will be contact-form.php. Here's a working demo:
在生成的 html 中，方法将默认为get，操作将为contact-form.php. 这是一个工作演示：
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>回答by philipisapain
You can register a helperMissinghelper 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 + "}}";
});
