knockout.js - 应该通过 jQuery 更改 div 的文本属性更新绑定的 ko.observableArray

Question

我有一个使用淘汰赛 foreach 绑定绑定的容器 div：

   <div id="foo" data-bind="foreach: { data: fooObservableArray, afterAdd: afterAdd}">
       <div data-bind="text: $data"></div>
   </div>

在 ViewModel 的 afterAdd 方法中：

     self.fooObservableArray = ko.observableArray([]);

     self.afterAdd = function(element){
           // make some changes to the DIV's text after it has been created
           <snip>
           $(element).text( someNewValue() );
     ; 

值someNewCalculatedValue未出现在 UI中，fooObservableArray但正在显示中。

淘汰赛是否没有观察 div 的 text 属性，因为它会观察绑定输入的值？

对通过 foreach 绑定创建的新 div 元素的文本应用 afterAdd 修改的正确方法是什么？

Answer 1

您不需要使用 jQuery 来设置文本值。Afteradd 是一个通常用于执行一些高级逻辑的函数，您不需要它。

首先更改您的 HTML

<div id="foo" data-bind="foreach: fooObservableArray">
    <div data-bind="text: MyText"></div>
</div>

现在更新你的 javascript

function MyModel()
{
this.MyText = ko.observable()
}

// Your knockout view model
function ViewModel()
{
 this.fooObservableArray = ko.observableArray();       
} 

var vm = new ViewModel();
ko.applyBindings(vm);

// Create 2 objects
var m1 = new MyModel();
m1.MyText("hello m1");
var m2 = new MyModel();
m2.MyText("hello m2");

// add them to array
vm.fooObservableArray.push(m1);
vm.fooObservableArray.push(m2);