2013-05-14 14 views
18

Backbone.js model getirme yöntemini kullanma konusunda çok kafa karıştırıyorum.backbone.js modeli getirme yöntemi nasıl çalışır?

profile: function(id) { 
    var model = new Account({id:id}); 
    console.log("<---------profile router-------->"); 
    this.changeView(new ProfileView({model:model})); 
    model.fetch(); 
} 

ilk adım, model hesabı örneği olacak, hesap modeli şöyle görünür: Aşağıdaki örnek
omurga yönlendirici bakın.

define(['models/StatusCollection'], function(StatusCollection) { 
    var Account = Backbone.Model.extend({ 
    urlRoot: '/accounts', 

    initialize: function() { 
     this.status  = new StatusCollection(); 
     this.status.url = '/accounts/' + this.id + '/status'; 
     this.activity  = new StatusCollection(); 
     this.activity.url = '/accounts/' + this.id + '/activity'; 
    } 
    }); 

    return Account; 
}); 

urlRoot özelliği nedir? Model nesnesi oluşturulduktan sonra profil görünümü bu this.changeView ile işlenecektir (yeni ProfileView ({model: model}));, changeview işlevi böyle görünüyor.

changeView: function(view) { 
    if (null != this.currentView) { 
    this.currentView.undelegateEvents(); 
    } 
    this.currentView = view; 
    this.currentView.render(); 
}, 

görünümü oluşturur sonra, profil bilgileri henüz göstermez, ancak model.fetch sonra(); deyimi çalıştır, modelden veriler görüntülenecek, neden? Getirmenin nasıl çalıştığını gerçekten bilmiyorum, bulmaya çalışıyorum ama şans yok.

cevap

38

Sorunun ne olduğundan emin olmadığından emin değilim, ama elimden geleni açıklamak için elimden gelenin en iyisini yapacağım.

urlRoot öğesinin arkasındaki kavram, temel URL olur ve alt öğelerin, urlRoot'a eklenen kimlikle altına getirilmesi gerekir. Örneğin

, aşağıdaki kod:

var Account = Backbone.Model.extend({ 
    urlRoot: '/accounts' 
}); 

baz url ayarlayacaktır. Eğer olsaydı Sonra) (bu getirme örneğini ve çağırmak için:

var anAccount = new Account({id: 'abcd1234'}); 
anAccount.fetch(); 

o şu isteği olacaktır: orada durumda

GET /accounts/abcd1234 

, sen urlRoot ayarlama ve daha sonra açıkça url ayarlarken böylece sağladığınız urlRoot göz ardı edildi.

Ben url nasıl türetildiğini görmek için (şaşırtıcı özlü var) Omurga kaynağına bakmak için teşvik: http://backbonejs.org/docs/backbone.html#section-65

diğer soruyu cevaplamak için, profil bilgileri derhal göstermez nedeni (ilgili getirmenin olduğu) şebekeye gider, sunucunuza gider ve görüntülenmeden önce cevap beklemek zorundadır.

Bu anlık değil.

Engellemeyen bir şekilde yapılır, yani istekte bulunur, yaptıklarını yapmaya devam eder ve istek sunucudan döndüğünde, omurganın başka bir şey yapmak için kullandığı bir olayı tetikler. Yapılması gereken şimdi, artık modelin verisine sahipsin, bitti.

profile: function(id) { 
    // You are instantiating a model, giving it the id passed to it as an argument 
    var model = new Account({id:id}); 
    console.log("<---------profile router-------->"); 

    // You are instantiating a new view with a fresh model, but its data has 
    // not yet been fetched so the view will not display properly 
    this.changeView(new ProfileView({model:model})); 

    // You are fetching the data here. It will be a little while while the request goes 
    // from your browser, over the network, hits the server, gets the response. After 
    // getting the response, this will fire a 'sync' event which your view can use to 
    // re-render now that your model has its data. 
    model.fetch(); 
} 

modeli yapabilirsiniz birkaç yolu vardır getirilen olmuştur sonra, görünüm güncellenir sağlamak istiyoruz Yani eğer:

Burada neler olduğunu açıklamak için Snippet'inizdeki bazı yorumlar koyduk Bunu yapın: (1) modele başarı geri dönüşünü iletin.fetch() (2) 'senkronizasyon' olayı için görüntüleme saatinize bir işleyici kaydeder, geri döndüğünde görünümü yeniden oluşturur (3) görünümünüzü başarılı bir geri çağırma için örneklendirmek için kodu koydu. Ağ talebi geri gelene kadar ve modelinizin veriye sahip olana kadar oluşturulmalıdır.

+0

İlk cevap için teşekkürler, çok güzel bir açıklama. Fetch() 'sync' olayını tetikledikten sonra, görünüm otomatik olarak oluşturulacak mı? Bana verdiğiniz önerileri, bazı örnekler yapabilir misiniz, çünkü ben backbonejs ve javascript'te oldukça yeni, bu dili iyi biliyorum ama çok iyi değil. –

+0

urlroot geçersiz kılınır mı? Bu var taban Cuzu = _.result (bu 'urlRoot') || _.result (this.collection, 'url') || UrlError() ;? –

+0

İlk sorunuz için, senkronizasyon etkinliği görünümü otomatik olarak oluşturmaz. Bunu etkinleştirmek isterseniz, aşağıdakini ekleyin: "view.on ('sync', this.render, this);" –