単一のJSONオブジェクトへの基本的なノックアウトJSのマッピング

Question

ノックアウトの新機能で、ノックアウトのメリットを得たいjqueryモバイルアプリケーションを作成しています。私は最後の日、非常に単純な問題のために壁に頭を叩くのに費やした。私はコードを削除して手で手でバインドしたので（ほとんどのjquery上でKOを使用する目的を敗北させる）..とにかく誰かが私にKOの本当の力を使わなければならないものを変える方法を私に示すことができました。

{"id":9,"fullName":"John Doe","firstName":"John","lastName":"Doe","referenceNumber":"BUY-08","position":"Buyer","type":"Buyer","telephone":"028 82 240780","email":"m@email.com","departmentId":3,"departmentName":"DEPT B","country":"United Kingdom"} 

私のHTML：：

​​

マイJavascriptを：

私は見つけることができる任意のコード例はこれよりもはるかに複雑な問題（配列などを扱う）

私のJSONのために常にでした

$(document).ready(function() { 

    function DetailsViewModel() { 
     var self = this; 
     self.fullName = ko.observable(""); 
     self.reference = ko.observable(""); 
     self.email = ko.observable(""); 
     self.position = ko.observable(""); 
     self.departmentName = ko.observable(""); 
     self.country = ko.observable(""); 

     var success = function (data) { 
      self.fullName(data.fullName); 
      self.reference(data.referenceNumber); 
      self.email(data.email); 
      self.position(data.position); 
      self.departmentName(data.departmentName); 
      self.country(data.country); 
      $.mobile.loading('hide'); 
     }; 

     webAPICall("api/user/getcurrentuser", 
      "GET", success); // simple wrapper I'm using for ajax calls 

    } 
    ko.applyBindings(new DetailsViewModel()); 
}); 

ご協力いただきありがとうございます。ありがとうございます！

Answer 1

追加の機能やビューモデルの計算が不要な場合は、マッピングプラグインの使用は非常に簡単です。あなただけko.mapping.fromJSにあなたのJSONを渡す必要があります。

var viewModel = {}; 

function success(data) { 
    viewModel = ko.mapping.fromJS(data); 
    ko.applyBindings(viewModel); 
} 
webAPICall("api/user/getcurrentuser", "GET", success); 

使用fromJS機能、それはJSON文字列である場合、データはJSオブジェクトとfromJSONある場合。 data-bindの属性とjsonのプロパティ名が同じであることを確認してください。ここで

は実施例である：私はラウンド初めてしようとしていたほぼ正確に何http://jsfiddle.net/axrwkr/5t5fj/50/