将css运行时添加到表行，数据绑定行

我真的不确定如何解决。 然而，我非常接近解决方案，现在只需要你的专家小帮助。 我的工作小提琴就在这里 。 页面加载时，选中2个复选框。 我的观点如下所示

我的观点模型如下

 var data1 = [{ name1: "one", id: 1, display: "Test1" }, { name1: "two", id: 2, display: "Test2" }, { name1: "three", id: 3, display: "Test3" }]; var data2 = [{ name2: "five" }, { name2: "two" }, { name2: "three" }]; var viewModel = { dataOne: ko.observableArray(data1), dataTwo: ko.observableArray(data2), duplicates: ko.observableArray() }; viewModel.dataTwo.push({ name: "four" }); //add one on the end var flattenedOne = ko.utils.arrayMap(viewModel.dataOne(), function (item) { return item.name1; }); var flattenedTwo = ko.utils.arrayMap(viewModel.dataTwo(), function (item) { return item.name2; }); var differences = ko.utils.compareArrays(flattenedOne, flattenedTwo); //return a flat list of differences ko.utils.arrayForEach(differences, function (difference) { if (difference.status === 'retained') { viewModel.duplicates.push(difference.value); } }); 

现在，当用户单击“更新”按钮时，它再次加载数据，现在选中了3个复选框。 我想要实现的是

1. 当用户单击更新按钮时，它应该将css添加到表行，并且只将该行加粗。

2. 当用户单击更新按钮时，不应选中复选框。

因此，在我们的示例中，当用户单击更新按钮时，它应该将行设为粗体，但不应选中复选框。 因此，单击更新按钮时，只有第一行是粗体。 目前，当页面加载时，它会使2行加粗并检查哪个是错误的。 它应该使行加粗只点击更新按钮。 请帮帮我们。

Answer 1

希望这能解决你的问题。

检查这个小提琴

 I have given separate condition using another observable . 

Html： –

   Update  

脚本：-

  var data1 = [{ name1: "one", id: 1, display: "Test1" }, { name1: "two", id: 2, display: "Test2" }, { name1: "three", id: 3, display: "Test3" }]; var data2 = [{ name2: "five" }, { name2: "two" }, { name2: "three" }]; var viewModel = { dataOne: ko.observableArray(data1), dataTwo: ko.observableArray(data2), duplicates: ko.observableArray(), checkDuplicate : ko.observableArray() // new observable to handle condition }; viewModel.UpdateData = function(){ data2 = [{ name2: "one" }, { name2: "two" }, { name2: "three" }]; viewModel.dataTwo(data2); var flattenedOne = ko.utils.arrayMap(viewModel.dataOne(), function (item) { return item.name1; }); var flattenedTwo = ko.utils.arrayMap(viewModel.dataTwo(), function (item) { return item.name2; }); var differences = ko.utils.compareArrays(flattenedOne, flattenedTwo); //return a flat list of differences ko.utils.arrayForEach(differences, function (difference) { if (difference.status === 'retained' && viewModel.checkDuplicate().indexOf(difference.value) == -1 ) { viewModel.duplicates.push(difference.value); } }); }; viewModel.dataTwo.push({ name: "four" }); //add one on the end var flattenedOne = ko.utils.arrayMap(viewModel.dataOne(), function (item) { return item.name1; }); var flattenedTwo = ko.utils.arrayMap(viewModel.dataTwo(), function (item) { return item.name2; }); var differences = ko.utils.compareArrays(flattenedOne, flattenedTwo); //return a flat list of differences ko.utils.arrayForEach(differences, function (difference) { if (difference.status === 'retained') { viewModel.checkDuplicate.push(difference.value); } }); ko.applyBindings(viewModel);