Güncelleme Knockout.js JSON tarafından gözlemlenebilir

Question

JSON üzerinden bir ızgara oluşturmaya ve daha fazla kayıt ile güncellemeye çalışıyorum. Bu basit örnekte gerekli işlevselliği başarabiliyorum ancak sadece bir JSON kaydını güncelleyebiliyorum/itebiliyorum. JSON üzerinden birden fazla kayıt ekleyebilmek ister misiniz? Bunu nasıl başarabilirim? Bir çeşit döngü oluşturmak ve her bir JSON sonucunu gözlemlenebilir duruma getirmek zorunda kalabileceğimi düşündüm, ancak nakavtun JSON üzerinden daha iyi bir güncelleme/ayrıştırma yolu bulabileceğini umuyordum?

İşte şu ana kadar elde ettiklerimizi bir kopyası: http://jsfiddle.net/sparkhill/crSbt/

 function Users(user_id, password) { 
    this.user_id = ko.observable(); 
    this.password = ko.observable(); 
} 

var viewModel = { 

    users: ko.observableArray([]), 


    addUser: function() { 
     this.users.push({ 

      user_id: "", 
      password: "" 
     }); 
    }, 

    addJSON: function() { 


     //Works Fine 
     var JSONdataFromServer 
     ='{"user_id":"frances","password":"password"}'; 

     //More than one result - wont map - Would Ideally like to map lots of records at one time 
//var JSONdataFromServer ='{"user_id":"frances","password":"password"}, {"user_id":"frances","password":"password"}'; 

     var dataFromServer = ko.utils.parseJson(JSONdataFromServer); 


     this.users.push(dataFromServer); 

     //Tried 
     //this.users.push(JSON.parse(JSONdataFromServer)); 


    } 

}; 

viewModel.users(); 
ko.applyBindings(viewModel); 

    </script> 

Güncelleme bu iş gibi görünüyor ama daha verimli bir yöntem onların olup olmadığını merak? ko kullanın) http://jsfiddle.net/johnpapa/nfnbD/

1:

addJSON: function() { 

     //Works Fine 
     var JSONdataFromServer 
     ='[{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"}]'; 

     var results = JSON.parse(JSONdataFromServer); 

     var i = results.length; 

     for(var i = 0; i < results.length; i++){ 

      this.users.push(results[i]); 
     }; 

Answer 1

Bkz mapping eklentisi

kullanabilirsiniz .utils.arrayPushAll işlevi 2) kendi mantığınızı kullanın 3) Kendi işlevinizi gözlemlenebilir şekilde düzenleyinArray

Eğer ko.utils.arrayPushAll işlevini kullanırsanız

Detaylar ...

1) Dizi etkili bir kendisi yazılır olur çünkü, çok valueHasMutated aramanız gerekmektedir. Gözlemlenebilirlik, onu değiştirdiğini söylediğiniz şeyleri söndürmez. İşte bunu nasıl geçerli:

ko.utils.arrayPushAll(this.users(), dataFromServer); 
this.users.valueHasMutated(); 

2) İkinci seçenek esasen böyle arrayPushAll fonksiyonu olarak aynı kodu kullanarak kendi döngü mantığı yazmaktır.

for (var i = 0, j = dataFromServer.length; i < j; i++) 
this.users.push(dataFromServer[i]); 

3), bunun gibi observableArray üzerinde kendinize ait bir işlev oluşturun: Bu kod üzerinde bir öğe eklenir her zaman bildirir

ko.observableArray.fn.pushAll = function(valuesToPush) { 
     var items = this; 
     for (var i = 0, j = valuesToPush.length; i < j; i++){ 
      items.push(valuesToPush[i]); 
     } 
     return items; 
}; 

rağmen. Bu yüzden hepsini eklemek daha iyi olabilir, daha sonra bildirimde bulunabilirsiniz. Bu daha verimli olurdu. Şunun gibi: Sonra

ko.observableArray.fn.pushAll = function(valuesToPush) { 
    var underlyingArray = this(); 
    this.valueWillMutate(); 
    ko.utils.arrayPushAll(underlyingArray, valuesToPush); 
    this.valueHasMutated(); 
    return this; 
}; 

böyle diyoruz:

this.users.pushAll(dataFromServer); 

Answer 2

Sen Burada bu yapabileceğini 3 yolu vardır ... Bu keman bulundu http://knockoutjs.com/documentation/plugins-mapping.html

Answer 3

ben bu oldukça eski bir yazı olduğunu biliyorum ama karşıya geldi ve sadece ben nakavt bunu yapmanın başka bir yolunu göstermek istedim gelecekteki ziyaretçiler için kendi pushAll oluşturmadan.

Gözlemlenebilir bir dizide nakavt içinde push.apply kullanabilirsiniz. Bu, bir sunucudan birden çok öğeyi itmenizi ve yalnızca bir bildirimi tetiklemenizi sağlar.

Example in JsFiddle

Düzenleme: öğrenmek isteyen bu yüzden push.apply kullanmak okuma yerine bir döngü içinde push kullanan herkes için further reading