javascript - json をノックアウト モデルに再バインドするための支援

Question

私はノックアウトの初心者で、助けが必要です。

私は mvc asp.net ページを持っており、それが読み込まれると、json を返すコントローラー アクションへのクライアント側呼び出しを行い、そこからビュー モデルを作成し、ノックアウトでマークアップにバインドします。

これはいくつかのサンプルコードです:

Javascript

  var CartViewModel = function (d) {

    var self = this,
        showCartInner = function () {
            // code to show a container
        },
        hideCart = function () {
            // code to hide a container
        };

    self.showCart = function () {  
        showCartInner();
    };

    ko.mapping.fromJS(d, {}, self);

    self.hasItems = ko.computed(function () {
        return self.NumberOfItems() > 0;
    });

    self.count = ko.computed(function () {
        return self.NumberOfItems();
    });

    self.qualified = ko.computed(function () {
        return self.Qualified().length > 0;
    });

    return self;
};

$(document).ready(function () {

    $.getJSON("/getcart", function (data) {
        ko.applyBindings(new CartViewModel(data), window.document.getElementById("cart"));
    });

});

HTML

<div id="cart">
<div style="display: none;" data-bind="css: { content: !hasItems() }">
empty Cart
</div>

<div style="display: none;" data-bind="css: { content: hasItems() }">
    <span class="loading">
      Look at your items
    </span>
</div>

<div style="display: none;" id="hidden_menu">
    <div id="hidden_cart">
        <div class="cart-item">
            <div class="thumb-img inline">
                <img data-bind="attr: { src: Product.Image, alt: Product.Name }" />
            </div>
            <div class="product-desc inline">
                <span class="name" data-bind="text: Product.Name"></span>
            </div>
            <div class="product-price" data-bind="text: Product.Price"></div>
        </div>
        <div class="cart-offers" data-bind="visible: qualified()">
            <div class="triangle-up-gray"></div>

            <div class="cart-offer" data-bind="visible: qualified()">
                <div id="qualified" data-bind="foreach: { data : Qualified }">
                    <div class="cart-offer-desc" data-bind="text: Description"></div>
                    <a class="cart-offer-action" data-bind="href: Url">View More</a>
                </div>
            </div>
        </div>
    </div>
</div>

ページが読み込まれると、ショッピング カートを取得するための呼び出しが行われ、マークアップにバインドされます。上記を参照してください。

ユーザーがコントローラー アクションの呼び出しを介してページ上のカートを更新すると、同じ json オブジェクトが返されます。この時点で、マークアップを新しい json オブジェクトで更新したいと考えています。

これを達成するには、上記にどのような変更を加える必要がありますか? どうすればjsonオブジェクトを渡し、バインディングを再適用する必要がなく、マークアップが変更を表示することができますか?