jQuery.tmpl 数组类型属性的问题

发布于 2024-11-04 06:23:42 字数 585 浏览 3 评论 0原文

我有 Javascript 对象，例如：

var data = {
    Id: 1,
    Name: "Some name",
    Days: [true, true, true, false, false, true, false]
};

这些对象是在客户端生成的，我想使用 jQuery.tmpl 插件将它们可视化。我定义了一个模板：

<ul class="days">
{{each Days}}
    <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li>
{{/each}}
</ul>

当我调用时，

$("<ul class='days'>...</ul>").tmpl(data);

我只得到一组 LI 元素，并且没有将 UL 包裹在它们周围...

我缺少什么这里？

原文

I have Javascript object like:

var data = {
    Id: 1,
    Name: "Some name",
    Days: [true, true, true, false, false, true, false]
};

These objects are generated on the client and I want to visualise them by using jQuery.tmpl plugin. I've defined a template to be:

<ul class="days">
{{each Days}}
    <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li>
{{/each}}
</ul>

When I call

$("<ul class='days'>...</ul>").tmpl(data);

I only get a set of LI elements and no wrapping UL around them...

What am I missing here?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

绝不服输 2024-11-11 06:23:42

您需要将该模板代码移动到

<script type="text/x-jquery-tmpl" id="daysTemplate">
  <ul class="days">
  {{each Days}}
    <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li>
  {{/each}}
  </ul>
</script>

然后，选择并呈现该模板，如下所示：

// You can inject the result into any container, using methods like appendTo()
//  html(), insert(), etc.
$('#daysTemplate').tmpl(data).appendTo('body');

You need to move that template code to a <script> element (if you haven't already), like this:

<script type="text/x-jquery-tmpl" id="daysTemplate">
  <ul class="days">
  {{each Days}}
    <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li>
  {{/each}}
  </ul>
</script>

Then, select and render that template like this:

// You can inject the result into any container, using methods like appendTo()
//  html(), insert(), etc.
$('#daysTemplate').tmpl(data).appendTo('body');

回复收藏 0 原文

灰色世界里的红玫瑰 2024-11-11 06:23:42

我创建了一个小提琴并且它可以工作。
模板

<script id="daysTemplate" type="text/x-jquery-tmpl">
     <ul class="days">
    {{each Days}}
        <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li>
    {{/each}}
    </ul>
</script>

脚本

var data = {
    Id: 1,
    Name: "Some name",
    Days: [true, true, true, false, false, true, false]
};
$("#daysTemplate").tmpl(data).appendTo('body');

I created a fiddle here and it works.
template

<script id="daysTemplate" type="text/x-jquery-tmpl">
     <ul class="days">
    {{each Days}}
        <li class="day {{if $value}}on{{else}}off{{/if}}">${$index + 1}</li>
    {{/each}}
    </ul>
</script>

script

var data = {
    Id: 1,
    Name: "Some name",
    Days: [true, true, true, false, false, true, false]
};
$("#daysTemplate").tmpl(data).appendTo('body');

回复收藏 0 原文

~没有更多了~