KO Mapping vấn đề với đối tượng trẻ em

Question

tôi nhận được các dữ liệu sau từ máy chủ:

var data = [{ id: 0, child: { prop1 : 'a', prop2 : 'b' } } //Child object has data 
      ,{ id: 0, child: null } ]; // Child object is null 

Tôi đang gặp một số vấn đề sau khi tôi lập bản đồ dữ liệu sử dụng các plugin mapping knock-out. Vấn đề là đối tượng bên trong child không cùng loại.

Sau khi thực hiện điều này:

ko.mapping.fromJS(data, viewModel.data); 

tôi nhận được rằng đối tượng đầu tiên có một tài sản child loại Object với dữ liệu. Tuy nhiên đối tượng thứ hai có một thuộc tính child của loại Observable rằng khi nó chưa được trả về null.

Làm cách nào tôi có thể làm điều đó trong cả hai trường hợp các đối tượng có cùng loại thậm chí một đối tượng có giá trị và giá trị kia là rỗng. Thay đổi cách hoạt động của máy chủ không phải là một tùy chọn. Tôi mong đợi có Object và null hoặc cả hai Observables.

JsFiddle here.

Answer 1

Bạn cần sử dụng create option để cho trình cắm bản đồ biết cách bản đồ sẽ lập bản đồ thuộc tính child của bạn.

Vì vậy, nếu bạn muốn có có Object và null bạn cần phải trả lại null khi sở hữu con bạn là null:

var mappingOptions = { 
    child: { 
     create: function(options) { 
      if (!options.data) 
       return null; 
      return ko.mapping.fromJS(options.data); 
     } 
    } 
} 

ko.mapping.fromJS(data, mappingOptions, viewModel.data); 

Demo JSFiddle.

Hoặc nếu bạn muốn họ cả Observables:

var mappingOptions = { 
    child: { 
     create: function(options) { 
      return ko.observable(ko.mapping.fromJS(options.data)); 
     } 
    } 
} 

ko.mapping.fromJS(data, mappingOptions, viewModel.data); 

Answer 2

Như đã đề cập, giải pháp là tùy chọn lập bản đồ, nhưng hãy chắc chắn để luôn thử nghiệm options.data cho giá trị null và sau đó trở ko.observable trống(), nếu không bạn sẽ gặp rất nhiều rắc rối với sự ràng buộc! Tôi đã dành rất nhiều thời gian để tìm ra điều đó.

var mappingOptions = { 
    child: { 
     create: function (options) { 
      return options.data != null ? ko.observable(ko.mapping.fromJS(options.data)) : ko.observable(); 
     } 
    } 
}