0

同じモデルを新しいデータで再バインドしたい、または ajax を呼び出した後に、まったく新しいデータでモデルを更新したいと言うことができます。

function returnData(url,data,type){
    $.post(url, data, function(returnedData) {

    if(type == "search")
    {
    ko.applyBindings(new SearchViewModel(returnedData,"#searchbox",url,data),$("#searchbox")[0]);   
    }
});
}

これは、データに対してajaxを呼び出すコードであり、新しいデータが受信されると、それをモデルにバインドします。初回は問題ありませんが、次回は同じデータを2倍にします。

returnData(doamin+"/1.0/search",{userid:"12033914132",keyword:""},"search");

新しい検索語を入力するたびに同じ関数を呼び出したい。

observable を使用してデータを更新できることはわかっていますが、古いバインディングをクリアして新しいバインディングを追加したい

function SearchViewModel(data,id,url,userdata) {
    var self = this;
    // Editable data

    var ParsedData = JSON.parse(data);

    self.Contacts = ko.observableArray(ParsedData.Contacts);
    self.Sms = ko.observableArray(ParsedData.Sms);
    self.Calendar = ko.observableArray(ParsedData.Calendar);
    self.Logs = ko.observableArray(ParsedData.Logs);
    self.Total = ko.toJS(self.Contacts).length+ko.toJS(self.Sms).length+ko.toJS(self.Calendar).length;
    self.ContactsCount = ko.toJS(self.Contacts).length;
    self.SmsCount = ko.toJS(self.Sms).length;
    self.CalendarCount = ko.toJS(self.Calendar).length;
}
4

2 に答える 2

2

バインディングを 1 回だけ適用してから、ノックアウト マッピング プラグインを使用して既存のビュー モデルを更新します。

function SearchViewModel() {
    var self = this;
    // Editable data

    self.Contacts = ko.observableArray();
    self.Sms = ko.observableArray();
    self.Calendar = ko.observableArray();
    self.Logs = ko.observableArray();
    self.Total = ko.toJS(self.Contacts).length+ko.toJS(self.Sms).length+ko.toJS(self.Calendar).length;
    self.ContactsCount = ko.toJS(self.Contacts).length;
    self.SmsCount = ko.toJS(self.Sms).length;
    self.CalendarCount = ko.toJS(self.Calendar).length;    
}

count プロパティをcomputed observablesに変更する必要がありますが、それ以外はすべてマッピングプラグインでマッピングする必要があります:

var searchViewModel = new SearchViewModel();

function returnData(url,data,type){
    $.post(url, data, function(returnedData) {

    if(type == "search")
    {
      searchViewModel = ko.mapping.fromJS(returnedData);
    }
});
}
ko.applyBindings(new SearchViewModel(returnedData,"#searchbox",url,data),$("#searchbox")[0]);
于 2013-02-06T09:27:36.647 に答える
0

SearchViewModel をオブザーバブルに格納できます。これにより、マッピングや再バインドを必要とせずに SearchViewModel を更新できます。

function ViewModel() {
    var self = this;

    self.searchViewModel = ko.observable();
}

var viewModel = new ViewModel();
ko.applyBindings(viewModel, $("#searchbox")[0]); 

function returnData(url,data,type){
    $.post(url, data, function(returnedData) {

    if(type == "search")
    {
    // ko.applyBindings(new SearchViewModel(returnedData,"#searchbox",url,data),$("#searchbox")[0]);   
       viewModel.searchViewModel(new SearchViewModel(returnedData,"#searchbox",url,data));
    }
});
}

意見：

<div id="#searchbox" data-bind="if: searchViewModel()">
    <div data-bind="with: searchViewModel()">
       ... your markup
    </div>    
</div>
于 2013-02-08T21:27:03.877 に答える