ノックアウトJSは、Ajaxの結果をbinnding

Question

私はノックアウトJSの新機能です、私はノックアウトJS viewmodelにAJAXの結果データをバインドしようとしていますが、データを表示するバインド中に問題に直面している、私はモデルとviewmodelを作成して私はajaxから結果を得ています。助けが必要。以下は

私のコードです：

// ajax on page load/// 
$.ajax({ 
    type: "POST", 
    dataType: "json", 
    url: baseUrl + 'api/xxx/xxx', 
    data: UserProfileModel, 
    success: function(data) { 
     result = data; 
     ////view model//// 
     userDetailsViewModel(result); 
    }, 
    error: function(error) { 
     jsonValue = jQuery.parseJSON(error.responseText); 
     //jError('An error has occurred while saving the new part source: ' + jsonValue, { TimeShown: 3000 }); 
    } 
}); 

//// view model/// 
var userDetailsViewModel = function(result) { 
    console.log(result); 
    self = this; 
    self.user = ko.observable(new userModel(result)); 
}; 

$(document).ready(function() { 
    ko.applyBindings(userDetailsViewModel()); 
}); 

/// Model//// 
function userModel(result) { 
    this.name = ko.observable(); 
    this.userName = ko.observable(); 
} 

Answer 1

1. あなたuserDetailsViewModelがundefinedを返す関数です。実際のビューモデルを作成する場合は、newを使用するか、return文を作成する必要があります。例えば：

   var UserDetailsViewModel = function(result) { 
       var self = this; 
       self.user = ko.observable(new UserModel(result)); 
   }; 
   
   var mainUserDetailsViewModel = new UserDetailsViewModel(data); 
   

2. あなたはAJAXコールバックの範囲からあなたのviewmodelを更新する場合の参照を格納する必要があります。あるいは、ajaxの機能の一部をのviewmodelにすることもできます。最も簡単な例：

   var mainUserDetailsViewModel = new UserDetailsViewModel(data); 
   
   $.ajax({ 
       success: function(data) { 
       mainUserDetailsViewModel.user(new UserModel(data)); 
       } 
   }); 
   

   あなたapplyBindings呼び出しでこのモデルを使用していることを確認してください：

   ko.applyBindings(mainUserDetailsViewModel); 
   

注私はインスタンス化する必要がある機能のためにCapitalizedNamesを使用しました、とuncapitalizedNamesについてこれらの関数のインスタンスデフォルトの命名規則に従い、何が何であるかを把握するのに役立ちます。