切換知名度點擊

Question

考慮淘汰賽的foreach約束力的聲明

<div data-bind="foreach: Tests"> 
     <a><span data-bind="text: testName"></span></a> 
     <table> 
     <!--table contents --> 
     </table> 
</div> 

這會產生多個div元素綁定時 - 每個都包含自己的標籤和表格。當我點擊超鏈接時，其相應表格的可見性必須切換。我無法從服務器操作測試內容。我怎樣才能得到這個效果？ 在此先感謝。

Answer 1

由於測試是observableArray簡單迭代它在您的視圖模型，並添加一個屬性來切換可見 - 當你點擊

function viewModel() { 
    self.Tests = ko.observableArray(yourData); 
    ko.utils.arrayForEach(self.Tests(), function (test) { 
     if (!test.isExpanded) { 
      test.isExpanded = ko.observable(); 
     } 
    } 
    self.toggleIsExpanded = function (sender) { 
     sender.isExpanded(!self.isExpanded()); 
    } 
} 

現在 -

<div data-bind="foreach: Tests"> 
     <a><span data-bind="text: testName, click: toggleIsExpanded"></span></a> 
     <table data-bind="visible: isExpanded"> 
     </table> 
</div> 

而在你的ViewModel鏈接名稱，它將切換isExpanded屬性，這將使表格可見，取決於isExpanded的值。如果你想防止每次加載DOM到DOM中，你也可以使用if綁定而不是可見的綁定。