1

我使用 MVC4、Knockout 和 Knockout.Mapping 插件。

在页面的初始加载时，除了敲除正在渲染的部分之外，所有内容都会渲染，有时会延迟 1-4 秒，直到 javascript/knockout 加载此部分。最初在测试期间，数据很少，这真的不是问题，但是有很多数据，它非常明显，最重要的是看起来非常不专业。

这是我们的加载脚本

<script type="text/javascript">
    $(function () {
        ordersViewModel = new ordersViewModel('@Html.Raw(JsonConvert.SerializeObject(Model))');
        ko.applyBindings(ordersViewModel);
    });
</script>

我的猜测是我可以使用“显示：无”或隐藏该部分，直到加载了 javascript，我想做一些类似于 Github 的事情，在那里他们对正在获取的内容有一个加载对话框。

我敢肯定有人遇到过这个问题并有一个优雅的解决方案。

任何帮助将非常感激。

干杯，山姆

4

1 回答 1

3

正如您在问题中讨论的那样，我将采用 CSS 路线。最简单的方法是简单地拥有两个容器，一个包含正在加载的数据，一个包含典型的加载消息，可能带有一个 gif 指示正在加载（就像在此处找到的那些http://www.ajaxload.info/）。

因此，您需要做的就是一个接一个地放置容器：

<div id="loadingMessage">
    My loading message
</div>
<div id="content" style="display: none;">
    My content
</div>

然后在绑定完成后执行这个 JS：

$("#loadingMessage, #content").toggle();
于 2012-12-14T07:37:23.957 回答