切换知名度点击

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绑定而不是可见的绑定。