使用jquery-tmpl,我想通过向每一秒添加一个类来对行的表示进行条带化处理,因此从数据['Cat','Dog','Horse','Noddy']生成:
<li>Cat</li>
<li class="odd">Dog</li>
<li>Horse</li>
<li class="odd">Noddy</li>
这里建议的解决方案看起来像是可以进一步细化的东西的开始,以便我们的noddy's容易消化.
似乎我在jquery模板中调用javascript函数时遇到了一些问题.我在这里设置了一个演示:http://jsfiddle.net/SXvsZ/8/
代码如下:
function htmlDetail(){
return "hello <strong>world</strong>";
}
var book = [
{ title: "Goodnight, World!",
detail: { author: "Jojo Mojo", synopsis : "What the ..." }},
{ title: "Rainbow",
detail: { author: "Cookie", synopsis : "Huh?" }}
];
$("#testTemplate").tmpl(book).appendTo("#bookList");
模板看起来像:
<script id="testTemplate" type="text/x-jquery-tmpl">
{{if title.length}}
<h3>${title}</h3>
<p>Start: ${ htmlDetail() } :End</p>
{{/if}}
</script>
<div id="bookList"></div>
好像它应该呈现"hello world "我想让它也将HTML呈现为html而不是纯文本.
使用ASP.NET MVC:我在服务器上和客户端(比如jquery模板)中呈现我的视图之间陷入困境.我听不到有人说的话,我不喜欢将两者混合在一起的想法.例如,有些人说他们将渲染初始页面(比如一堆评论的列表)服务器端,然后当添加新评论时他们使用客户端模板.要求在代码的两个不同区域具有相同的渲染逻辑,这让我想知道人们如何说服自己这是值得的.
你用什么原因来决定在哪里使用？
使用ASP.NET Web窗体时,您的参数如何变化？
我的部分中有大量的jQuery模板占用空间<head>("text/x-jquery-tmpl").我想将这些标签移动到外部文件.我希望我可以做类似的事情,<link href="/templates.html" type="section"/>但我意识到这不是什么链接的意思,事实上它似乎没有用.
这样做的最佳方法是什么？我可以查看一个加载器(可能很难找到一个html加载器),但这感觉有点矫枉过正.可能只是因为我没有其他选择,只能在我的页面中包含标签.
我无法使用jQuery.tmpl()正确分配HTML.如果我将某个值的值作为html标记传递,则会将其呈现为 原样,而不是在页面上呈现的HTML标记
<div id="window">
<script id="lines" type="text/x-jquery-tmpl">
<div id="${id}" class="line ${type}"><span>${name}</span>: ${body}</div>
</script>
</div>
var line = {
name: 'John',
body: '<strong>hello</strong>
};
$('#lines').tmpl(line).appendTo('#window');
经过一些澄清后,我重申了我的问题如下.
在jquery template我得做.像这样凌乱使用函数的返回值
<p class="hidden">${$data.score = getScore(results)}</p>
{{tmpl(homeTeam, {score: score}) "#scoreTemplate"}}
这可以简化 - 如下所示,遗憾的是不能做到这一点？
{{tmpl(homeTeam, {score: getScore(results)}) "#scoreTemplate"}}
非常感谢,
罗布森
默认情况下,KO"将仅渲染新项目的模板,并将其插入现有DOM".
有没有办法禁用此功能(如,强制KO重新渲染所有项目)？
我有一个复杂的页面,使用knockout通过模板呈现内容.渲染需要大约10秒钟,所以我想在发生这种情况时显示进度条.我试图在模板中添加一个回调afterRender打破页面的方法 - 我认为这个方法更多的是摆弄模板生成的html.
我还尝试创建一个绑定处理程序,在每次调用时更新进度条:
ko.bindingHandlers.updateProgressBar = {
init: function (element, valueAccessor) {
viewModel.updateProgressBar();
}
};
...
<ul data-bind="template: {name: 'genericItemTemplate', foreach: ChildItems}, updateProgressBar: true"></ul>
不幸的是,虽然每次都调用该方法,但是在模板完全渲染完成之前UI不会更新,所以我没有得到我正在寻找的运行进度.
我正在使用tmpl模板库.
如何显示更新UI,模板的进度通过observableArray中的大量项目进行？
我正在尝试使用嵌套的jQuery模板在表中显示JSON数据.
我可以让它只能达到第一级.
这是我想要实现的一个例子:
A Client有一个订单列表和一个Fullname.使用clientTemplate和显示orderTemplate.到目前为止,一切正常.
现在,Order有一个列表Products.因此,我调用一个productTemplate从内orderTemplate.并且数据没有绑定:(
我猜这是因为我正在传递$data给productTemplate并$data指向顶级对象(the Client).但是如何通过当前的订单呢？
这是我的模板:
<script id="clientTemplate" type="text/x-jquery-tmpl">
<tr><td>Fullname</td></tr>
<tr><td>${Fullname}</td></tr>
<tr>
<td>
<table>
<tr><td>Order Id</td><td>Order Date</td></tr>
{{tmpl($data) "#orderTemplate"}}
</table>
</td>
</tr>
</script>
<script id="orderTemplate" type="text/x-jquery-tmpl">
{{each Orders}}
<tr>
<td>${Id}</td>
<td>${DateOrder}</td>
</tr>
<tr>
<td>
<table>
<tr><td>Product Id</td><td>Quantity</td></tr>
{{tmpl($data) "#productTemplate"}}
</table
</td>
</tr>
{{/each}}
</script>
<script id="productTemplate" type="text/x-jquery-tmpl">
{{each ProductList}}
<tr>
<td>${Id}</td>
<td>${Quantity}</td>
</tr>
{{/each}}
</script>
我的页面有一个标签:
<script id='header' src='/Templates/Shared/Header.tmpl.html' type='text/html'></script>
Firebug告诉我Firefox 5正在请求此资源.在HTML选项卡上,我可以导航到script元素并看到它包含/Template/Shared/Header.tmpl.html的内容.
但是,jQuery坚持脚本标记为空.$('#header').html()返回一个空字符串.我不明白为什么.
是的,我可以使用$ .get()加载文件并使用$('#header').html(data)来设置内容.然后我可以按照我的预期使用它.这显然会产生第二个请求,我想避免.
jquery-templates ×10
jquery ×5
knockout.js ×2
asp.net ×1
asp.net-ajax ×1
asp.net-mvc ×1
firebug ×1
firefox ×1
header ×1
html ×1
javascript ×1
link-tag ×1
loading ×1
nested ×1