Knockout JS Render While Load

如果您有一个列表和一个计数标签。当每个项目被推入视图模型数组中时，如何渲染每一行并使用新的计数实时增加标签？Knockout JS Render While Load

对于我来说，显示的列表保持空白，计数为0，并且在viewmodel数组被填充时整个UI被阻塞，然后当每个项目被推入数组时，列表中的所有行只是突然显示与计数标签中的最后一个数字。

2012-07-30 John McMillion

想向我们展示您的代码？有办法做到这一点，但它将取决于你如何填充你的数组。 – Tyrsius 2012-07-30 23:05:58

你可以显示你到目前为止没有工作的代码吗？ – 2012-07-30 23:07:08

很难将我的代码抽象出来......希望我的描述有意义......我将Knockout样本复制到小提琴中，调整它以加载一些数据。您可以看到用户界面被封锁，并且如果您点击添加礼物按钮，它会一次渲染。 http://jsfiddle.net/johnmcmillion/YnHQj/ – 2012-07-31 01:10:36

因为JavaScript是单线程的，所以你的UI被阻塞是非常合乎逻辑的。因此，使用foreach会阻止脚本的其他执行。

快速修复此问题将使用setTimeout来延迟代码块的执行。例如，如果你使用：

for (var i=0;i< totalGifts;i++) { 
    setTimeout(function(){ 
     self.gifts.push({name: "New Gift " + i, price: "New Price: " + i}); 
    },1);    
}

每个更新将被触发1ms延迟和异步，因此不会阻止你的用户界面。我已经更新了你的小提琴，check it out。

来源

2012-07-31 07:42:47 thomaux

Knockout JS Render While Load

回答

相关问题