更新HTML Knockout.js

Question

私は、新しいデータを取得するために「dayid」で$ .getJsonを発射するイベントをクリックしていgetJson

function getDaysMeals(dayid) 
    {   
     $.getJSON('jsonchoose/'+ dayid +'', function(data) { 
       var viewModel = { 
        dayMeals: ko.observableArray(data) 
       }; 
       ko.applyBindings(viewModel); 
      }); 

    } 

を使用して、新しいデータをretreivingています。

私は新しいデータでテーブルを更新しようとしています。現時点では、毎回既存のデータに追加しています。コードapplybindingsで

<table> 
<tbody data-bind="foreach: dayMeals"> 
    <tr> 
    <td data-bind="text: description" class="display-meal"></td> 
    <td data-bind="text: measure" class="display-meal"></td> 
    <td data-bind="text: total_cal" class="display-meal"></td> 
    </tr> 
</tbody> 

Answer 1

あなたがgetJSON（）を呼び出すたびに呼び出さなっています。

applybindingsを1回だけ呼び出す必要があります。おそらく、applyBindings（）を初期化の場所に移動したり、条件付きで1回だけ呼び出すことができます。

//Make necessary changes as per your requirement. 
var viewModel; 

function onLoad() 
{ 
viewModel = { dayMeals: ko.observableArray([]) }; 
ko.applyBindings(viewModel); 
} 

function getDaysMeals(dayid) 
{   
    $.getJSON('jsonchoose/'+ dayid +'', function(data) { 
    // This is just for reference. Minor change may be required. 
    viewModel.dayMeals(data); 
    }); 
}