jquery - Knockout JS のリスト、履歴の詳細をカスタム バインディングでバインド

Question

ユーザーが任意の行をクリックして詳細を表示するデータのリストがあります

以前のユーザー選択が保存され、カスタム バインドをトリガーして ajax を呼び出してデータを取得します。

  var jsondata = [{
       "xxd": "1",
           "r_xd": "1",
           "fxd": 1,
           "dtxd": 1,
           "drxd": 1,
           "dsxd": 1,
           "x_ther": "1",
           "x_therslutxn": "1",
           "x_xsnd": true,
           "x_xsfxxed": true,
           "x_lat": "1",
           "x_ln": "1",
           "x_delete": false,
           "x_deldate": "2013-12-02T00:00:00",
           "s_c_by": 1
   }, {
       "xxd": "2",
           "r_xd": "2",
           "fxd": 2,
           "dtxd": 2,
           "drxd": 2,
           "dsxd": 1,
           "x_ther": "3",
           "x_therslutxn": "4",
           "x_xsnd": true,
           "x_xsfxxed": true,
           "x_lat": "1",
           "x_ln": "1",
           "x_delete": false,
           "x_deldate": "2013-12-02T00:00:00",
           "s_c_by": 321
   }];

   //-----------------get historical data
   //jQuery.support.cors = true;
   ko.bindingHandlers.history = {
       init: function (element, valueAccessor) {
           console.log('-------init history---------');
           //console.dir(element);
           var primaryId = valueAccessor();
           //console.log(primaryId);

           var itemData = null;
           // JSON RETURN DATA  

           $.post("/echo/json/", {
               json: JSON.stringify(jsondata)
           },

           function (data, textStatus, jqXHR) {
               console.log('getJSON');
               console.dir(data);
               new HistoryRowViewModel(data);
           });
       }
   };


   function HistoryRowViewModel(data) {
       //this.history = ko.observable(); 
       ko.mapping.fromJS(data, historymapping, vm.historys);
   }
   var historymapping = {
       key: function (data) {
           console.log(data);
           return ko.utils.unwrapObservable(data);
       },
       create: function (options) {
           console.log(options.data);
           return HistoryRowViewModel(options.data);
       }
   }

私のビューモデルは次のように私を返します: {"historys":[null,null]}

と

     <table id="historical" data-bind="history:vm.primaryid()">      
    <pre data-bind="text: JSON.stringify(ko.toJS(vm), null, 2)"></pre>       
      <thead>    
        <tr data-bind="foreach: $parent">           
          <!--  <pre data-bind="text: JSON.stringify(ko.toJS($data)), null, 2)"></pre> -->   
          <th data-bind="text:$data">
          </th>          
        </tr>      
      </thead>                      
      <tbody>              
        <!-- ko foreach: vm.historys() -->       
        <tr data-bind="foreach: vm.historys()">                   
          <!-- ko foreach: $parent -->       
          <!--<pre data-bind="text: JSON.stringify(ko.toJS($data), null, 2)"></pre>    -->       
          <td data-bind="text:$data.incidentid"> </td>                                
          <!-- /ko -->                          
        </tr>                             
        <!-- /ko -->                        
      </tbody>                  
    </table>

これは mybinding の障害ですか? history:vm.primaryid()

valueAccessor() は primaryid を返します 私はそれを渡し、クエリを実行できました

私の意図は、jsondataから返されるすべての行をプッシュすることです

それを私のビューにバインドします。

どうすればこれを達成できますか? 私のコンセプトは間違っていますか？

私はそれを（ http://jsfiddle.net/sigibb/NsNvc/1/ ）に投稿しましたが、機能していません..他の依存関係なしでバインドする方法がわかりません。