文本比较 {{if}} JQuery 模板
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5038357/
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
Text comparison {{if}} JQuery Template
提问by jimjim
I am looking to use jQuery Templates plugin for some forms I am creating - data is loaded in JSON from ReST Uri.
我希望为我正在创建的某些表单使用 jQuery 模板插件 - 数据从 ReST Uri 加载到 JSON 中。
The issue I am having is trying to do a conditional to show either a label or textfield depending on a variable value.
我遇到的问题是尝试根据变量值执行条件来显示标签或文本字段。
I really like the jQuery Templates but maybe its completely the wrong way to go - it jsut seems better to me than building up the element - what do you think?
我真的很喜欢 jQuery 模板，但也许它完全是错误的方式 - 它对我来说似乎比构建元素更好 - 你怎么看？
Here is what I have:
这是我所拥有的：
Template:
模板：
<script type="x-jquery-tmpl" id="tmplForm">
<table>
<tr>
<td><label for="title">Title</label></td>
<td><input type="text" name="title" id="title" value="${Title}" /></td>
</tr>
<tr>
<td><label for="description">Description</label></td>
<td><textarea name="description" id="description" rows="5" cols="20">"${Description}"</textarea></td>
</tr>
<tr>
<td><label for="optiosn">Options</label></td>
<td>
<table id="env">
{{each Option}}
<tr>
<td>${$value.Name}</td>
<td>
//here is where I would like to be an if on the $value.Type
//pseudo
//if($value.Type == "Label") {
// <label for="value">$($value.Value)</label>
//} else {
// <input type="text" name="value" id="value" value="${$value.Value}" />
//}
//this is my very ugly attempted hack - which doesnt work either
//${$item.getOptionsElement($value)}
</td>
</tr>
{{/each}}
</table>
</td>
</tr>
</table>
</script>
Data and template application:
数据和模板应用：
<script type="text/javascript">
var data = [
{
Id: 1,
Title: "Title1",
Description: "Description 1",
Options: [
{ Type: "Label", Name: "labelName", Value: "LabelValue" },
{ Type: "TextField", Name: "txtName", Value: "txtValue" }
]
}
];
$("#divRForm").empty();
//$("#tmplForm").tmpl(data).appendTo("#divRForm");
$("#tmplForm").tmpl(data, {
getOptionsElement: function (option) {
if (option.Type == "Label") {
return "<label for='value'>option.Value</label>";
} else {
return "<input type='text' name='value' id='value' value='option.Value' />";
}
}
}).appendTo("#divRForm");
</script>
I have a single div on the page:
我在页面上有一个 div：
<div id="divRForm"></div>
Thanks for your time and I hope you can put me on the right track.
谢谢你的时间，我希望你能让我走上正轨。
Jim
吉姆
回答by Dave Ward
You can use {{if}}for that:
你可以使用{{if}}：
<table id="env">
{{each Option}}
<tr>
<td>${$value.Name}</td>
<td>
{{if $value.Type == "Label"}}
<label for="value">$($value.Value)</label>
{{else}}
<input type="text" name="value" id="value" value="${$value.Value}" />
{{/if}}
</td>
</tr>
{{/each}}
</table>
