Инициализация Knockout.js с использованием jQuery Ajax

Question

Я использую нокаут в первый раз, он выглядит очень легко, но я не могу выполнить некоторые простые вещи, которые можно сделать.

Мой HTML файла

<tbody data-bind="foreach: LOBModel"> 
     <tr> 
      <td data-bind="text:lob_ID"></td> 
      <td data-bind="text: lob_Name"></td> 
      <td data-bind="text: lob_Description"></td> 
     </tr> 
    </tbody> 

Мой JS Файл

$(window).load(function() { 
    getLOB(); 
    //var vm = { 
    // LOBModel: [ 
    //  { lob_ID: 'Bert', lob_Name: 'Bertington', lob_Description: 'Bertington' }, 
    //  { lob_ID: 'Charles', lob_Name: 'Charlesforth', lob_Description: 'Bertington'}, 
    //  { lob_ID: 'Denise', lob_Name: 'Dentiste', lob_Description: 'Bertington' } 
    // ] 
    //} 
    //ko.applyBindings(vm); 
    //Commented Section Work 

    function getLOB() { 
     $.ajax({ 
      url: '/Admin/GetLOB', 
      type: "POST", 
      dataType: "json", 
      success: function (returndata) { 
       alert(returndata.data); 
       var LOBModel = ko.mapping.fromJS(returndata); 
       ko.applyBindings(); 
      }, 
      error: function() { 
      } 
     }); 
    } 
}); 

В моем контроллере я передаю данные следующим

public JsonResult GetLob() 
    { 
     SLADAL objDal = new SLADAL(); 
     return Json(objDal.GetLOB()); 
    } 

Пожалуйста, помогите.

Я получаю

0x800a139e - Microsoft JScript ошибка выполнения: Не удается разобрать привязок.

Сообщение: TypeError: 'LOBModel' не определено;

Наручники значение: Еогеасп: LOBModel

EDIT: Для тех, кто ищет полного Ajax Получить и сообщение Пример использования JSON массив объекта, это полезная ссылка я нашел. надеюсь, что это помогает некоторому телу.

URL: http://www.dotnetcurry.com/showarticle.aspx?ID=847

Держите Кодирование: D

Answer 1

Для привязки данных к ViewModel вы сначала должны передать его в качестве аргумента для связывания методы (я предполагаю, что это LOBModel массив), как это:

  var LOBModel = ko.mapping.fromJS(returndata); 
      ko.applyBindings(LOBModel); 

Затем, когда вы к нему доступ позже в HTML вы должны использовать ключевое слово $root.

<tbody data-bind="foreach: $root"> 
    <tr> 
     <td data-bind="text:lob_ID"></td> 
     <td data-bind="text: lob_Name"></td> 
     <td data-bind="text: lob_Description"></td> 
    </tr> 
</tbody> 

Для более больших примеров вы всегда можете взять интерактивный учебник по http://learn.knockoutjs.com/

Если вы хотите добавить больше функциональных возможностей к ViewModel, вы всегда можете создать его так:

  var LOBModel = ko.mapping.fromJS({ 
       data: returndata, 
       yourFunctionHere: function() { 
        ... 
       } 
      }); 
      ko.applyBindings(LOBModel); 

Тогда вам нужно будет изменить свой HTML, чтобы выглядеть, я также добавил событие click как пример того, как получить доступ к viewmodel из контекста нокаута:

<tbody data-bind="foreach: $root.data"> 
    <tr> 
     <td data-bind="text: lob_ID, click: $root.yourFunctionHere"></td> 
     <td data-bind="text: lob_Name"></td> 
     <td data-bind="text: lob_Description"></td> 
    </tr> 
</tbody>