无法查看内容，因为尚未收到数据

Question

如何等待数据加载然后打印html内容？

这是HTML标记：

<div id="item-details-content">
    <input type="hidden" id="item-id" value="@id" data-bind=""/>
    <div class="item-list" data-bind="init: itemPage.loadcontent(@id), with: itemPage.item">
        <div class="item-container clearfix">
            <div class="item-content clearfix">
                <div class="title" data-bind="text: Title">

这是JS标记：

var itemViewModel = {
    item: {},
    loadcontent: function (getID) {
        $.ajax({
            url: '/api/item/details/' + getID,
            dataType: 'json',
            success: function (data) {
                itemViewModel.item = data;
            }
        });
    }
};

var mainViewModel = {
    indexPage: indexViewModel,
    itemPage: itemViewModel
};

观察

1. 当变量为ko.observable()时，它最终显示数据，问题是我不希望它更新。

Answer 1

这样的事情应该有效。

<div id="item-details-content" data-bind="if: isLoaded">
....
</div>


and javascript:

var itemViewModel = {
    item: {},
    loadcontent: function (getID) {
        $.ajax({
            url: '/api/item/details/' + getID,
            dataType: 'json',
            success: function (data) {
                itemViewModel.item = data;
                mainViewModel.isLoaded(true);
            }
        });
    }
};

var mainViewModel = {
    indexPage: indexViewModel,
    itemPage: itemViewModel,
    isLoaded: ko.observable(false)
};

另一种方法是在＃item-details-content div上使用隐藏类，只需执行$（'＃item-details-content'）。show（）;

    <div id="item-details-content" class="hidden">
    ....
   </div>


success: function (data) {
    itemViewModel.item = data;
    $('#item-details-content').show();
}