knockout.js - knockout - ¿Cómo puedo enlazar un ko.observableArray de cadenas?

knockout visible

Question

Estoy tratando de vincular un ko.observableArray de cadenas a una plantilla, pero no puedo obtener la plantilla para recoger los cambios en las cadenas dentro de la matriz.

Si enlace un conjunto de objetos en lugar de un conjunto de cadenas, obtengo las actualizaciones de JSON, pero no desencadenan nada hasta que realmente cambie el primer valor que no sea de matriz. Sin embargo, preferiría encontrar una serie de cadenas, ya que podré publicar el modelo de datos directamente en el servidor sin ningún procesamiento posterior.

¿Cómo puedo obtener las actualizaciones de mis matrices de cadenas para desencadenar, y cómo puedo asegurarme de que desencadenen cambios correctamente sin tener que actualizar un valor que no sea de matriz?

Si no es posible enlazar a una matriz observable de cadenas, ¿cómo puedo hacer que los eventos se activen al actualizar los objetos dentro de la matriz observable?

Vea el ejemplo aquí: http://jsfiddle.net/gcEHC/2/

En este ejemplo, los datos de array3 se reflejarán en el modelo cuando se cambie el valor, pero los cambios en los datos de array1 y array2 nunca se mostrarán.

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

En KO 3, si apunta a $ rawData en el enlace, el ejemplo de array2 funciona como se esperaba.

Answer 2

De los documentos:

Simplemente colocar un objeto en un array observable no hace que todas las propiedades de ese objeto sean observables. Por supuesto, puede hacer que esas propiedades sean observables si lo desea, pero esa es una opción independiente. Un Array observable solo rastrea qué objetos contiene y notifica a los oyentes cuando se agregan o eliminan los objetos.

Necesita crear un objeto que tenga una propiedad observable (de su cadena). Luego haz un Arreglo observable de esos objetos.

Por ejemplo, aquí hay un ejemplo que actualiza la propiedad de un objeto 2 segundos después de aplicar los enlaces:

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);

Aquí hay una muestra completa y ejecutable: http://jsfiddle.net/psteele/z6gbM/