2015-01-14 2 views
0

Я в процессе замены одного адского кода javascript/jquery с knockoutjs, и я пытаюсь найти лучший путь вперед. У меня нет времени, чтобы заменить все одновременно, поэтому мне придется интегрировать логику нокаута с существующим javascript ...Populate модель нокаута из javascript

Есть ли способ заполнить модель представления нокаутом из javascript, который не вызывается из данных атрибут привязки? Любая помощь будет приятной, так как я не смог найти ее где-нибудь еще (по крайней мере, не все, что сработало).

Я знаю, что я упоминаю здесь, это не «правильный» способ делать что-то, но я пытаюсь перенести части кода javascript ... Выполнение всего за один раз не вариант в данный момент.

(с помощью нокаута 3,2)

Edit: Обычно существующий Javascript делает что-то вроде:

$('#productlist').append(productItemHtmlCode); 

И я предпочел бы это сделать что-то вроде:

ViewModel.productList.push(productItemObject); 
+1

Я не уверен, что вы просите. Вы ищете способ сделать наблюдаемые из ваших данных? Или вы просите «обернуть» текущий код в режиме просмотра KO? Или оба? Может быть, пример поможет. – Beartums

+0

Существующая логика javascript модифицирует DOM многими способами и путем обновления текущей логики до нокаута, я бы хотел, чтобы она изменила ViewModel вместо этого ... если это вообще возможно :) – Sandman

+0

Итак, в основном, из приведенного вами примера, вы хотите временно отменить работу Knockout из * обновления вида от модели * до * обновления модели ** частично ** из представления *? Я не думаю, что это возможно. Вместо этого я бы начал рассматривать мой код jQuery как компоненты и постепенно преобразовывать каждую часть в код нокаута. – Tyblitz

ответ

0

Если я правильно понимаете, в настоящее время у вас есть что-то вроде этого:

<div id='myDiv'> 
     current status is: <span id='statusSpan'>Active</span> 
</div> 

с некоторым соответствующим JavaScript, что может быть что-то вроде:

function toggleStatus() { 
    var s= document.getElementById('statusSpan'); 
    s.innerHTML = s.innerHTML == 'Active' ? 'Inactive' : 'Active'; 
} 

И вы хотите, чтобы изменить его так, что Javascript обновляет ViewModel, а не манипулируя DOM?

var app = (function() { 

    var vm = { 
     statusText: ko.observable('Active'), 
     toggleStatus: toggleStatus 
    } 

    return vm 

    function toggleStatus() { 
     vm.statusText = vm.statusText == 'Active' ? 'Inactive' : 'Active'; 
    } 

})(); 

ko.applyBindings(app,document.getElementById('myDiv')); 

И тогда HTML будет

<div id='myDiv'> 
     current status is: <span id='statusSpan' data-bind="text: statusText"></span> 
</div> 

Если это то, что вы говорите, это то, что Knockout предназначен для. Javascript обновляет viewmodel, нокаут управляет DOM.

Пример, который вы даете, легко представить в Knockout.

HTML-:

<div> 
     <table data-bind="foreach: products"> 
      <tr> 
       <td data-bind="text: id"></td> 
       <td data-bind="text: name"></td> 
       <td data-bind="text: category"></td> 
      </tr> 
     </table> 
    </div> 

и в ViewModel:

vm = { 
    products: ko.observableArray(), // empty array to start 
    addProduct: addProduct 
} 

return vm; 

function addProduct(id, name, category) { 
    products.push({id: id, name: name, category:category}); 
} 

и т.д.

Смежные вопросы