2013-04-01 34 views
8

Tôi đang cố gắng ràng buộc một ko.observableArray của chuỗi thành một mẫu, nhưng tôi không thể lấy mẫu để nhận các thay đổi trong các chuỗi bên trong mảng.Làm cách nào để liên kết ko.observableArray của chuỗi?

Nếu tôi liên kết một tập hợp các đối tượng thay vì tập hợp các chuỗi, tôi nhận các cập nhật cho JSON, nhưng chúng không kích hoạt bất kỳ thứ gì cho đến khi tôi thực sự thay đổi giá trị đầu tiên, không phải mảng. Tuy nhiên, tôi muốn tìm một chuỗi các chuỗi, vì tôi sẽ có thể đăng mô hình dữ liệu trực tiếp trở lại máy chủ mà không cần xử lý hậu kỳ.

Làm cách nào để tôi có thể cập nhật các mảng chuỗi của mình để kích hoạt và làm cách nào để đảm bảo rằng chúng kích hoạt chính xác các thay đổi mà không phải cập nhật giá trị không phải mảng?

Nếu không thể liên kết với một chuỗi có thể quan sát được, làm thế nào tôi có thể kích hoạt các sự kiện khi cập nhật các đối tượng bên trong mảng quan sát được?

Xem ví dụ ở đây: http://jsfiddle.net/gcEHC/2/

Trong ví dụ này, dữ liệu array3 sẽ được phản ánh trong mô hình khi giá trị được thay đổi, nhưng thay đổi để array1 và array2 dữ liệu sẽ không bao giờ xuất hiệ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> 

Trả lời

5

Từ docs:

Đơn giản chỉ cần đặt một đối tượng vào một observableArray không làm cho tất cả các thuộc tính của đối tượng mà mình quan sát được . Tất nhiên, bạn có thể làm cho những thuộc tính đó có thể quan sát được nếu bạn muốn, nhưng đó là lựa chọn độc lập . Một ObservableArray chỉ theo dõi các đối tượng mà nó giữ và thông báo cho người nghe khi các đối tượng được thêm vào hoặc bị loại bỏ.

Bạn cần tạo đối tượng có thuộc tính quan sát (trong chuỗi của bạn). Sau đó tạo một ObservableArray của các đối tượng đó.

Ví dụ, đây là một ví dụ cập nhật thuộc tính của một đối tượng 2 giây sau khi các ràng buộc được áp dụng:

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

Dưới đây là một hoàn chỉnh, mẫu Runnable: http://jsfiddle.net/psteele/z6gbM/

+0

khi tôi tạo một chuỗi quan sát có thể quan sát được, nó vẫn không hoạt động. Xem array2 trong jsfiddle được liên kết ở trên. Lưu ý rằng những thay đổi đối với mảng dây quan sát được không bao giờ được nhận - cho dù nội dung có thể quan sát được hay không. – slipheed

+0

Xem câu trả lời cập nhật của tôi với mã mẫu. – PatrickSteele

+0

Xin chào Patrick, cảm ơn bạn đã cập nhật mã - nhưng câu hỏi thực sự là tại sao nó không hoạt động: 'this.array2 = ko.observableArray ([ko.observable (" hi "), ko.observable (" there ")]); Không có gì trong tài liệu cho thấy nó không hoạt động. – slipheed

9

Trong KO 3, nếu bạn trỏ đến $ rawData trong ràng buộc, ví dụ array2 hoạt động như mong đợi.

+1

Cảm ơn, đã quên $ rawData; đã có cùng một vấn đề, bây giờ nó hoạt động nếu đi trực tiếp vào mảng một chuỗi có thể quan sát được. –

Các vấn đề liên quan