SORU
24 Mayıs 2012, PERŞEMBE


ekleme backbone.js DOM içine el ekleme vs mevcut elemanları manzaralı

Benim uygulama benim ilk gerçek olmayan öğretici Omurga uygulaması, ve 2-ish sorular hakkında bir yönünü kullanarak backbone.js o değil yerleşme çok iyi bana olan ilgisi için enjekte manzara işlenmiş el içine DOM vs kullanarak mevcut bir öğe için el. "Öğretilebilir anlar" burada, ve yardım için teşekkürler. bir kaç vermek tüm ben şüpheleniyorum

En Omurga Görünümü örnek ben web bir Görünüm oluştururken tagName, kimliği ve/veya code belirtin, görmek ve böylece DOM bekar bir el oluşturmak. Onlar genellikle gibi bir şey:

App.MyView = Backbone.View.extend({
    tagName: 'li',
    initialize: function () {
     ...
    },
    render: function () { 
        $(this.el).html(<render an html template>);
        return this;
    }
}); 

Ama dersler her zaman DOM içine işlenmiş el almak tavsiye ediyorlar nasıl açıklamaya vakit yok. Bir kaç değişik şekilde gördüm. Bu yüzden, benim ilk soru: nerede bir görünüm vermek yöntemini çağırın ve DOM içine kendi el eklemek için uygun bir yerdir? (mutlaka bir ve aynı yer değil). Yapılan kök düzeyde hazır fonksiyonu belge sadece manzara başlatmak veya render işlevleri, veya bir router gördüm. ( $(function () ) . Bu herhangi bir iş, ama bunu yapmak için doğru bir yol olduğunu hayal edebiliyorum?

İkinci olarak, HTML/tel kafes ile başlıyorum, ve html bölümlerini şablonları Omurga için ilgili js dönüştürme manzarası. Yerine bırak render bir bekar eleman ve sağlayan bir bağlantı noktası olarak html sok, sanki onun daha doğal, sadece olacak bir eleman için bir görünüm ve olmayacak yerlere gidiyor, kullanmak için varolan, boşalttı kapsayıcı öğe (genellikle bir div span) el kendisini. Potansiyel olarak bu gibi (ekstra katman not) bakıyor sonunda hangi Ekle bekar benim el, belgede yer bulma konusunda endişelenmenize gerek yok bu şekilde

<div id="insert_the_el_in_here">  <!-- this is all that's in the original HTML doc -->
    <div id="the_el">  <!-- i used to be a backbone generated, unattached el but have been rendered and inserted -->
        <!-- we're finally getting to some useful stuff in here -->
    </div>
 </div>

Bölüm benim ikinci soru, temelde statik bir görünüm için, doğrudan benim görüşüme el gibi yanlış bir sayfanın HTML varolan bir öğe kullanarak bir şey var mı? Bu şekilde DOM zaten, doğru yerde, ve bu arama render sayfada hemen görüntüle kılacağını biliyorum. Benim bakış constsructor zaten exixting eleman geçerek bunu başarmak istiyorum''. el olarak Bu şekilde, bana öyle geliyor ki, DOM içine (bir çeşit tartışmalı soru yapma 1) anlaşmazlık konusunda endişelenmenize gerek yok, ve işlemek arayıp hemen DOM güncellenir. E. g.

<form>
   <div someOtherStuff>
   </div>
   <span id="myView">
   </span>
</form>

<script type="text/template" id = "myViewContents"> . . . </script>

<script type="application/javascript">
window.MyView = Backbone.View.extend( {
     initialize: function () {
          this.template = _.template($('#myViewContents').html());
          this.render(); 
     },
     render: function () {
          $(this.el).html(this.template());
          return this;
     }
});
$(function () {
    window.myView = new MyView({ el: $('#myView').get(0) });
});
</script>

Bu sayfadaki statik görünümleri ilgisi var mı? yani, bu görüşlerin sadece bir tane var, ve uzakta herhangi bir durumda değil. Yoksa daha iyi bir yolu var mı? Şeyler (bir yönlendirici, bir üst görünüm, sayfa yük üzerinde, yani, vb.) yapmak için farklı yolları olabileceğini fark ettim bir görünüm kullanıyorum nasıl dayalı, ama şu anda ilk sayfa yük kullanmak durumunda bakıyorum.

Teşekkürler

CEVAP
25 Mayıs 2012, Cuma


Kesinlikle hiçbir şey mevcut DOM düğümü için bir görünüm ekleme fikri ile bir sorun var.

Hatta sadece görünümde bir özellik olarak el koyabilir.

window.MyView = Backbone.View.extend( {
     el: '#myView',
     initialize: function () {
          this.template = _.template($('#myViewContents').html());
          this.render(); 
     },
     render: function () {
          this.$el.html(this.template()); // this.$el is a jQuery wrapped el var
          return this;
     }
});
$(function () {
    window.myView = new MyView();
});

Ne tavsiye, ne işleri... Omurga güzelliği esnek ve ihtiyaçlarını karşılamak olacaktır.

Ortak kalıpları ile ilgili olarak, genellikle manzarası, belki bir liste görünümü ve bireysel öğe görünümleri sonra izlemek için ana bir görünüm kendime zorunda bulmak.

Başka bir yaygın desen başlatma ile ilgili olarak Uygulama nesne bir tür şeylerle idare etmek zorunda

var App = (function ($, Backbone, global) {
    var init = function () {
        global.myView = new myView();
    };

    return {
        init: init
    };
}(jQuery, Backbone, window));

$(function () {
    App.init();
});

Ama gerçekten bir şeyleri YANLIŞ yolda olanı yap. önce hayır dedim. :)

Beni Twitter'da vurmak için ücretsiz eğer daha fazla yardıma ihtiyacın olursa @jcreamer898 da bak @derickbailey hissediyorum, BB bir guru gibi.

İyi eğlenceler!

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • 8lacKy

    8lacKy

    30 Mart 2009
  • Sali Kaceli

    Sali Kaceli

    24 ŞUBAT 2009
  • Chaîne de TheMoustic

    Chaîne de T

    5 Kasım 2006