Как заставить нокаутом восстановить привязку?

Question

Я хотел бы знать, как я могу заставить привязку нокаута обновить его значение. Обычно мы используем наблюдаемое, и таким образом связывание может происходить автоматически, когда наблюдаемые изменения. Но в моем случае я создал пользовательское связывание:

if (!ko.bindingHandlers.asyncHtml) { 
ko.bindingHandlers.asyncHtml = { 
    init: function (element, valueAccessor) { 
     var value = ko.utils.unwrapObservable(valueAccessor()); 
     var parameters = value.params.concat([function (data) { 
      $(element).html(data); 
     } ]); 

     parameters.concat([function (data) { 
      $(element).html('Unable to retrieve html.'); 
     } ]); 
     value.source.apply(null, parameters); 
    } 
} 
} 

Это объясняется тем, что функция, которая выполняет асинхронный вызов JSON может обновить соответствующий элемент (с возвращаемым HTML) один раз завершает вызов. Элемент, DIV в этом случае выглядит следующим образом:

<div id="myDiv" data-bind="asyncHtml: {source: getHtml, params: [myId()]}"> 

Моя проблема заключается в том, что еще одна особенность, на этой странице можно изменить значения базы данных, которые требуют myDiv обновляться в результате. Вероятно, я могу найти сложный способ исправить эту проблему, но мне было интересно, был ли более простой способ, когда я могу просто принудительно привязать привязку?

ПРИМЕЧАНИЕ: getHtml - это функция на моей модели просмотра, которая выполняет вызов JSON для извлечения HTML.

Благодаря

Answer 1

Надеюсь, я понял, что вы пытаетесь выполнить правильно, но я не уверен, поэтому позвольте мне объяснить, как я понимаю вашу цель.

1. У вас есть div (#myDiv), который будет извлекать исходный HTML-код с сервера.

2. У вас есть функция AJAX (getHtml), который извлекает этот HTML и OnSuccess обновления #myDiv, возможно, с этим:.

   $ ('# myDiv') HTML (serverResponseHTMLContent);

3. У вас есть еще одна функция, которая может создавать разные HTML-файлы, которые должны заменять созданный сервером html.

Если это все правильно, я бы предложил вам использовать привязку html нокаута.

Ваш div будет выглядеть так.

<div id="myDiv" data-bind="html: myDivInnerHtml"> 

myDivInnerHtml будет частью вашей ViewModel и должен быть наблюдаемым, как вы говорите, что вы обычно делаете. Перед первоначальным связыванием вызовите getHtml и установите значение для myDivInnerHtml вместо фактической установки html для myDiv.

myDivInnerHtml = ko.observable(serverHtmlString); 

Затем, когда вы применяете привязку, внутренний html myDiv будет установлен нокаутом. Чтобы обновить html, ваша клиентская функция может изменить значение myDivInnerHtml.

myDivInnerHtml(clientSideFunctionHtmlString); 

Если мои предположения ошибочны, и вы должны воссоздать тот же HTML с другим значением, то вы должны использовать шаблон, если это возможно, и сервер не должен посылать в HTML, но вместо этого значения для привязки к HTML ,

Кроме того, если функция клиентской стороны не создает html, а вместо этого значения привязаны к html, то это также не сработает.

Answer 2

Вы можете посмотреть на функции valueHasMutated(), которая уведомляет абонентов, что они должны заново оценить наблюдаемую.

См. How to force a view refresh without having it trigger automatically from an observable? для получения более подробного объяснения.