KO计算重新计算但不更新用户界面

我对淘汰赛有些新颖，并且遇到了一些与观测值有关的问题。这是一些淘汰赛我使用的配对缩小版本：KO计算重新计算但不更新用户界面

var model; 
function viewModel(data) { 
    var self = this;  
    self.favesData = ko.observableArray(data.User.Favorites);  
    self.splitRows = ko.computed(function() { 
     var i = 0; 
     var faveRows = []; 
     var size = 2; 
     while (i < self.favesData().length) { 
      faveRows.push(self.favesData().slice(i, i += size)); 
     } 
     return faveRows; 
    }); 

    self.refresh = (function (data) { 
     self.favesData(data.User.Favorites); 
    }); 
} 

function onComplete(result) { 
    if (!model) { 
     model = new viewModel(result); 
     ko.applyBindings(new viewModel(result)); 
    } else { 
     model.refresh(result); 
    } 
} 

<table class="table-main link" data-bind="foreach: splitRows"> 
    <tr data-bind="foreach: $data"> 
     <td> 
      <div class="link"> 
       <a href="#" data-bind="text: $data.Name"> 
       </a> 
      </div> 
     </td> 
    </tr> 
</table>

我使用AJAX GET，它调用的onComplete。数据进来很好，所有的东西在初始负载上都很好。然后我用新的输入调用相同的ajax函数，它开始正常工作 - 数据返回并且不同，刷新更新favesData，并且splitRows重新计算，但UI显示永不改变。不应该splitRows重新计算时更新绑定？我很困惑如何将新数据传递给favesData可以更新观察它的计算观察值，但计算的观察值不会更新UI。

来源

2015-12-04 withoutIf

在你的onComplete方法中，你没有将标记绑定到模型，而是绑定到viewModel的新实例，它应该如下所示。

ko.applyBindings(model);

刷新被称为上未使用的UI模型

来源

2015-12-04 22:44:38

哦，男人，魔鬼是在细节。谢谢！ – withoutIf

尝试clearing the array and pushing the new items in，类似;

self.favesData.removeAll(); 
data.User.Favorites.each(function(fav) { self.favesData.push(fav); });

看看是否这样排序。我倾向于使用官方的knockout mapping plugin，它能够很好地从服务器上“敲出”模型并刷新它们。

所以通常你最终做您的视图模型

self.refresh = function(data) { 
    ko.mapping.fromJS(data, {}, self); 
}

里面的东西这样对整个模型重新绑定耳目一新。

来源

2015-12-04 23:31:51

我不明白为什么人们将数组中的项目推送到可观察数组中。把数组放在那里。或者，如果您需要将它作为数组的单独副本，请使用'slice'。 –

@RoyJ - 这就是OP在刷新方法中似乎正在做的事情，但它不起作用。清除和重新设置可能会提供有关错误的线索。 –

KO计算重新计算但不更新用户界面

回答

相关问题