Question

相关，但未解决问题：KnockoutJS: Using 'html' binding, new elements not binding

如果你对一个元素有一个html绑定，并且更改了此html绑定外部敲除和/或挖空视图模型的内部html，则你不再能够控制更改原始html绑定。 1}}绑定。请参阅以下代码段

我对保持更改内容的方法（运行原始javascript / jquery）更感兴趣，而宁愿理解/修复为什么调用setdefault()不会更新

任何文档或链接也会有所帮助

＆＃13;

$(document).ready(function(){
  
  var VIEWMODEL = function(){
  	var _ = this;
    
    _.content = ko.observable("<div>content</div>")
    _.asyncoperation = function(){
    	$("#target")[0].innerHTML = "<div>async operation content</div>";
    }
    _.setdefault = function(){
    	_.content("<div>content</div>");
    }
  };
  var vm = new VIEWMODEL();
  
  ko.applyBindings(vm, $("#container")[0]);
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="container">
  <div id="target" data-bind="html: content"></div>
  <br/>
  <br/>
  
  <button data-bind="click: asyncoperation">async operation to replace text</button>
  <button data-bind="click: setdefault">set to default</button>
  
</div>

＆＃13;

Answer 1

在Knockout中，observable通常不会对实际没有更改值的更新做出反应。但是这可以使用notify extender进行更改，如下例所示。

另一方面，如果可能的话，通常会更好地通过Knockout。您可以使用类似knockout-postbox的内容来执行此操作。

使用邮箱

_.content = ko.observable("<div>content</div>").subscribeTo("content");
_.asyncoperation = function() {
    ko.postbox.publish("content", "<div>async operation content</div>");
}

http://jsfiddle.net/bLdv296r/

使用通知扩展器

_.content = ko.observable("<div>content</div>").extend({notify:'always'});

$(document).ready(function(){
  
  var VIEWMODEL = function(){
  	var _ = this;
    
    _.content = ko.observable("<div>content</div>").extend({notify:'always'});
    _.asyncoperation = function(){
    	$("#target")[0].innerHTML = "<div>async operation content</div>";
    }
    _.setdefault = function(){
    	_.content("<div>content</div>");
    }
  };
  var vm = new VIEWMODEL();
  
  ko.applyBindings(vm, $("#container")[0]);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="container">
  <div id="target" data-bind="html: content"></div>
  <br/>
  <br/>
  
  <button data-bind="click: asyncoperation">async operation to replace text</button>
  <button data-bind="click: setdefault">set to default</button>
  
</div>

Answer 2

会是这样的吗？在模型定义之外的onclick事件上更新模型。您仍在更新可观察但在模型定义之外。

这是一个小提琴http://jsfiddle.net/LkqTU/32527/

gvim.exe -f -d %4 -M %3 %1 %2 -c "wincmd J" -c "set modifiable" -c "set write"

KnockoutJS错误改变html绑定（外部敲除）的内容打破了html绑定

2 个答案:

使用邮箱

使用通知扩展器