如何迭代jsRender模板中的JSON數組？

Question

我有這樣的HTML和jsRender模板：

<div id="output"></div> 

<script id="template" type="text/x-jsrender"> 
<ul> 
    {{for}} 
    <li>{{:name}} likes to wear {{:shirtColor}} shirts</li> 
    {{/for}}   
</ul> 
</script>​ 

和我的JavaScript（jQuery的）類似這樣：

var data = [{ 
    name: 'Dan Wahlin', 
    shirtColor: 'white'}, 
{ 
    name: 'John Papa', 
    shirtColor: 'black'}, 
{ 
    name: 'Scott Guthrie', 
    shirtColor: 'red'} 
] 
; 

$('#output').html($('#template').render(data));​ 

因爲有些人可能看到的，這是由約翰爸爸的例子。也就是說，我已經修改了一下。但它並不像它應該那樣工作。其原因是，jsRender預計在JSON根對象，如約翰實例，其中{{爲}}是{{人們}}和數據對象是這樣的：

var data = { people: [{ 
    name: 'Dan Wahlin', 
    shirtColor: 'white'}, 
{ 
    name: 'John Papa', 
    shirtColor: 'black'}, 
{ 
    name: 'Scott Guthrie', 
    shirtColor: 'red'} 
] 
} 
; 

在我的ASP Json返回的.NET MVC控制器不具有根對象。我怎樣才能使這個工作？更改Json格式（以及我該怎麼做？）？或者我在我的jsRender代碼中做錯了什麼？

在此先感謝！

Answer 1

更改模板：

<ul id="output"></ul> 
<script id="template" type="text/x-jsrender"> 
    <li>{{:name}} likes to wear {{:shirtColor}} shirts</li> 
</script>​ 

必須工作。因爲當您使用數組對象呈現模板時，他呈現n次相同的模板。

Answer 2

將{{for}}更改爲{{for people}}

Answer 3

我遇到了同樣的問題。下面應該爲你做的伎倆：

<script id="template" type="text/x-jsrender"> 
    <ul> 
     {{for #data}} 
      <li>{{>name}} likes to wear {{>shirtColor}} shirts</li> 
     {{/for}} 
    </ul> 
</script> 

這使您可以循環傳遞到渲染方法，而不是在耶穌的回答個別項目在陣列上。