Başlangıç ​​görünümü modeli boş olduğunda Knockout viewmodel nasıl başlatılır

Question

Bir kurs listesi seçim aracı uygulamak için Knockout kullanıyorum. Verileri (MVC3/Razor) doldurmak için aşağıdaki yaklaşımı kullanıyorum; böylece, viewmodel başlangıçta dolduğunda, her bir KO dizisiyle (yani, CourseList, ScheduleList) çalışmayla ilgili hiçbir sorunum yok. Ancak, sunucudaki ilk yük sıfır satır döndürdüğünde, viewmodel 'ScheduleList' özelliğinin boş olduğu anlamına gelir, bu durumda .push() veya .removeAll() gibi herhangi bir yöntemi çağırmak mümkün değildir. Muhtemelen bu, gözlemlenebilir dizinin hiçbir zaman yaratılmayacağı bir şey olmadığı için yaratılmadığı anlamına gelir. Model doldurulduğunda, ScheduleList özelliği bir Liste ile doldurulur. MVC eylemi boş olarak döndürdüğünde bunu başlatmanın en iyi yolu nedir? Bunu ele veren bir jsFiddle var, ancak 'create' seçeneğini kullanmaya çalıştığımda, tüm modelimi boş bırakıyor. Sözdizimi 'oluşturma' seçeneğinin ne olduğundan emin değilim. jsFiddle burada: http://jsfiddle.net/rniemeyer/WQGVC/

// Get the data from the server 
var DataFromServer = @Html.Raw(Json.Encode(Model));  

// Data property in viewmodel 
var data = { 
    "CourseList": DataFromServer.CourseList , 
    "ScheduleList": DataFromServer.ScheduleList 
    }; 

$(function() { 
    // Populate Data property 
    viewModel.Data = ko.mapping.fromJS(data); 

    // ko.applyBindings(viewModel, mappingOptions);    
    ko.applyBindings(viewModel); 
}); 

ilk sayfa yükleme ScheduleList doldurmuyor, sonra aşağıdaki kod bir hata atar. İlk Sayfa yükleme verilerini içeriyorsa, o zaman bunu belli vermek, sizin haritalama parametreleri büyük oluşturma yapmak kurma vb

var oneA= 'abc'; 

// push not working     
this.Data.ScheduleList.push(oneA); 

Answer 1

.removeAll() ve .push() diyebiliriz yapısı. Sonra sizin için güncellemeleri yapacağız.

Büyük bir olasılıkla, DataFromServer ürününüzün aslında bir ScheduleList özelliği içermemesidir. Böylece eşleştirildiğinde, ilgili bir özellik asla yapılmaz. Haritalayıcı mevcut özellikleri yalnızca gözlemlenebilirlerle eşleştirecektir.

Görünüm modelinin, diziler ayarlanmadığında boş diziler eklemesi için create seçeneklerinde ayarlamanız gerekir. Bu şekilde, görünüm modeliniz, ilgili gözlemlenebilir dizilerle sonuçlanacaktır. Eğer beklendiği gibi kod çalışacaktır böylece CourseList veya ScheduleList bir dizi olduğunu sağlayarak

, eşlenen görünümü modeli observableArray nesneler olarak onları eşler.

var DataFromServer = { 
    'CourseList': [1,2,3] 
    //, 'ScheduleList': [] 
}; 

var dataMappingOptions = { 
    'create': function (options) { 
     var data = options.data; 
     data.CourseList = data.CourseList || []; 
     data.ScheduleList = data.ScheduleList || []; 
     return ko.mapping.fromJS(data); 
    } 
}; 

viewModel.Data = ko.mapping.fromJS(DataFromServer, dataMappingOptions); 

Answer 2

var data = { 
    CourseList: DataFromServer.CourseList || ko.observableArray([]) , 
    ScheduleList: DataFromServer.ScheduleList || ko.observableArray([]) 
    };