2015-04-29 4 views
0

У меня есть нокаутирующий ViewModel, который выглядит следующим образом:jQuery DOM-манипуляция с нокаутом ViewModel - использовать bindHandlers?

function myViewModel() { 
    this.update = function() { 
     ... 
    } 
    ... 
} 

И в bindingHandler, который выглядит следующим образом:

ko.bindingHandlers.myBindingHandler = { 
    init: function(element, valueAccessor, allBindings, viewModel) { 
     function manipulateDom(element) { 
      ... 
     } 
    } 
} 

Я хочу myViewModel вызвать manipulateDom всякий раз, когда метод обновления вызывается.

Я мог бы сделать это, используя функцию обратного вызова, установленный в bindingHandler:

function myViewModel() { 
    this.update = function() { 
     ... 
     this.myBindingHandlerCallback(); 
    } 
    ... 
} 

ko.bindingHandlers.myBindingHandler = { 
    init: function(element, valueAccessor, allBindings, viewModel) { 
     viewModel.myBindingHandlerCallback = manipulateDom.bind(null, element); 
    } 
} 

<div data-bind="myBindingHandler: null"></div> 

Еще одна идея у меня была в том, чтобы использовать «UpdateCount» наблюдаемым и подписавшись на него в bindingHandler:

function myViewModel() { 
    this.updateCount = ko.observable(0); 
    this.update = function() { 
     ... 
     this.updateCount(this.updateCount() + 1); 
    } 
    ... 
} 

ko.bindingHandlers.myBindingHandler = { 
    update: function(element) { 
     manipulateDom(element); 
    } 
} 

<div data-bind="myBindingHandler: updateCount"></div> 

Оба этих решения кажутся хрупкими и беспорядочными. Что такое «нокаут», способ приближения к этой проблеме? Должен ли я просто манипулировать DOM из viewModel?

Я хотел бы добавить, что функция manipulateDom имеет много логики, которая не применима в нокауте моде (измерение высоты окна, измерение DIV высот и т.д ...)

Спасибо!

+0

Вы пытались использовать 'update: function (element, valueAccessor, allBindings, viewModel) {...' рядом с 'init' в вашем настраиваемом обработчике привязки? – Jag

+0

Это гораздо более разумный подход к моему второму примеру, но привязка свойства updateCount к viewModel кажется немного беспорядочным. Есть ли другие варианты? Я обновил свой первоначальный вопрос с вашим предложением. –

ответ

1

Второй подход (с счетчиком) намного лучше, поскольку ViewModel не должен переопределять и изменять поведение ViewModel, переопределяя его свойства.

Вместо того, чтобы счетчик, если ваш обновление метод делает некоторые изменения в другие наблюдаемые свойства я бы создать вычисляемое свойство, которое будет подписываться на текущее состояние ViewModel и автоматически вызывать ваш DOM манипуляции привязки, если бы вы передать его как параметр привязки, нет необходимости увеличивать счетчик или любой другой флаг.