Question

我的MVC页面有以下方法，负责应用MVC @Model的绑定。这是我的_Layout，目前使用ViewBag来收集淘汰赛的数据LayoutVm：

<head>
@Styles.Render("~/bundles/css")
@Scripts.Render("~/bundles/js")
</head>

// body contents, then at the bottom:

@RenderSection("scripts", required: false)
@{
    var serialized = (string)JsonConvert.SerializeObject(ViewBag);
}
<script type="text/javascript">
    $(document).ready(ko.applyBindings(new LayoutVm(
                @Html.Raw(serialized.SanitizeData())), document.getElementById("nav-header")));
</script>

这是有效的，但看起来不完美 - 我可以看到所有的敲除绑定元素在应用任何逻辑之前渲染，所以最初页面看起来有些混乱，因为显示应该隐藏的元素，就好像viewmodel不会瞬间绑定。例如：

            <!-- ko if: isLoadingDropdown() -->
            <p class="dropdown-header">Loading...</p>
            <!-- /ko -->

isLoadingDropdown初始化为false，但内容内容会在页面呈现时显示很短的时间。解决这个问题的最佳方法是什么？

Answer 1

您可以隐藏它，直到应用绑定

http://jsfiddle.net/ehv83/

<body data-bind="visible: true" style="display: none">
    KO Content
</body>

没有内联css

http://jsfiddle.net/ehv83/1/

MVC模型+ knockoutJS - 应用渲染作为绑定的毛刺

1 个答案: