Mustache.js - 不想更新特定的div表

我正在使用Mustache.js呈現html頁面中的表格。我有一個表格的渲染模板。我從json數組中獲取視圖數據並呈現表。如果arrary有5個對象，則會在html頁面中創建5個表格。現在我有要求不呈現特定的表。例如，我想只渲染table1和table3。如果我刪除json中的其他表值，它將從UI中刪除。但我想保留所有表格，但只更新兩個表格。如何做到這一點？Mustache.js - 不想更新特定的div表

感謝。

來源

2016-08-05 JavaUser

不是完美的，但你可以渲染那麼一切都隱藏你不想看到的表格？你可以發佈一些代碼嗎？ –

@DanielShillcock，我不想隱藏桌子。代碼不可用。 – JavaUser

爲了幫助，代碼是必需的！ –

我不認爲你的解決方案將會是理想的，因爲mustache.js被設計爲logic-less模板系統。但是，我會不時地用鬍子一起捏造一些這樣的邏輯，所以讓我們這樣做。

你可能想要在這裏嘗試的是在渲染模板之前向數組中的每個對象添加另一個屬性（或克隆它併爲模板添加屬性）。所以，讓我們假設你有一個數組五個對象，只希望爲偶數索引那些創建表：

var myArray = [ 
    {myProp: 1}, 
    {myProp: 2}, 
    {myProp: 3}, 
    {myProp: 4}, 
    {myProp: 5} 
]; 

for (var i = 0; i < myArray.length; i++) { 
    myArray[i].showTable = i % 2 === 0; 
}

現在myArray的變量應該像這樣的事情：

var myArray = [ 
    {myProp: 1, showTable: false}, 
    {myProp: 2, showTable: true}, 
    {myProp: 3, showTable: false}, 
    {myProp: 4, showTable: true}, 
    {myProp: 5, showTable: false} 
];

你可以現在通過mustache中的「＃」運算符利用showTable屬性。您可以先使用「＃」來遍歷數組，然後在「循環」中檢查showTable屬性的真值。首先，這裏的呼叫Mustache.render來從模板創建的HTML，通過我們myArray的變量作爲TableArray：

Mustache.render($('#MyTemplate').html(), { TableArray: myArray });

然後，模板本身：

<script id="MyTemplate" type="text/template> 
    {{#TableArray}} <!--Iterates through array--> 
    {{#showTable}} <!--Only creates HTML inside if showTable property evaluates to true--> 
     <table>...</table> 
    {{/showTable}} 
    {{/TableArray}} 
</script>

來源

2016-08-24 22:13:56

Mustache.js - 不想更新特定的div表

回答

相關問題