Как я могу привязать ko.observableArray строк?

Question

Я пытаюсь привязать ko.observableArray строк к шаблону, но я не могу заставить шаблон забирать изменения в строках внутри массива.

Если я привязываю набор объектов вместо набора строк, я получаю обновления для JSON, но они ничего не запускают, пока я не изменю первое значение, отличное от массива. Однако я предпочел бы найти массив строк, так как я смогу отправить модель данных непосредственно на сервер без какой-либо последующей обработки.

Как я могу получить обновления для своих массивов строк для запуска, и как я могу гарантировать, что они правильно инициируют изменения без необходимости обновления значения без массива?

Если невозможно связать с наблюдаемым массивом строк, как я могу активировать события при обновлении объектов внутри наблюдаемого массива?

Смотрите пример здесь: http://jsfiddle.net/gcEHC/2/

В этом примере данные array3 будут отражены в модели, когда значение изменяется, но изменения в Array1 и данные array2 никогда не будет отображаться.

JS:

var ViewModel = function() { 
    this.value = ko.observable("hi") 
    this.array1 = ko.observableArray(["hi", "there"]); 
    this.array2 = ko.observableArray([ko.observable("hi"), ko.observable("there")]); 
    this.array3 = ko.observableArray([{ data: "hi" }, { data: "there" }]); 
}; 

ko.applyBindings(new ViewModel()); 

HTML:

<div class='liveExample'> 
    <p><input data-bind='value: value' /></p> 
    <div data-bind="foreach: array1"> 
     <p><input data-bind='value: $data' /></p> 
    </div> 
    <div data-bind="foreach: array2"> 
     <p><input data-bind='value: $data' /></p> 
    </div> 
    <div data-bind="foreach: array3"> 
     <p><input data-bind='value: data' /></p> 
    </div> 
</div> 

<pre data-bind="text: ko.toJSON($data)"></pre> 

Answer 1

От docs:

Просто поместить объект в observableArray не делает все из свойств этого объекта сами наблюдаемые , Конечно, вы можете сделать эти свойства наблюдаемыми, если хотите, но это независимый выбор . Наблюдаемый массив просто отслеживает, какие объекты он содержит , и уведомляет слушателей о добавлении или удалении объектов.

Вам необходимо создать объект с видимым свойством (вашей строки). Затем сделайте наблюдаемый массив этих объектов.

Например, вот пример, который обновляет свойство объекта 2 секунды после того, как применяются привязки:

var item = function(text) { 
    var self = this; 

    self.Name = ko.observable(text); 
} 

var vm = { 
    items: ko.observableArray([ 
     new item('one'), 
     new item('two'), 
     new item('three') 
     ]) 
} 

ko.applyBindings(vm); 
setTimeout(function() { 
    vm.items()[1].Name('updated!'); 
}, 2000); 

Вот полная, работоспособная образец: http://jsfiddle.net/psteele/z6gbM/

Answer 2

В KO 3, если вы укажите значение $ rawData в привязке, пример array2 работает так, как ожидалось.