Domanda

Sto attraversando un tutorial per imparare a utilizzare Backbone.js e sto avendo difficoltà a capire come vista Backbone sono "vedere" la collezione.

Di seguito è riportato il codice di vista, e sotto che è il codice Collection.

posso vedere che i $ album variabile viene assegnato alle '.albums particolare classe che è all'interno dell'elemento, ma non capisco come questo codice fa riferimento 'this.collection'.

Sia la vista e la raccolta vengono estese da classi standard Backbone.View e Backbone.Collection. Proprio da guardarlo, non riesco a vedere come anche conoscono esistere. Sto assumendo che la parola 'questo' si riferisce a questo particolare istanza di LibraryView.

Credo che questa è la mia domanda primaria:

Come è possibile che il codice collection = this.collection è in grado di vedere la collezione esterno?

// A wrapper view to display each album in Library
    window.LibraryView = Backbone.View.extend({         
        tagName: 'section',
        className: 'library',

        initialize: function() {
            _.bindAll(this, 'render');
            this.template = _.template($('#library-template').html());
            this.collection.bind('reset', this.render);
        },

        render: function() {            
            var $albums,
                collection = this.collection;           

            $(this.el).html(this.template({}));
            $albums = this.$('.albums');
            collection.each(function(album) {
                var view = new LibraryAlbumView({
                    model: album,
                    collection: collection
                });
                $albums.append(view.render().el);
            });
            return this;
        }

    });

Questa è la collezione Album:

// Albums Collection
    window.Albums = Backbone.Collection.extend({
        model: Album,
        url: '/albums'
    })

Modifica


Credo di aver trovato grazie all'aiuto qui:

Ci fu un altro pezzo di codice creare una variabile biblioteca e di assegnarlo a una nuova collezione album:

window.library = new Albums();

Inoltre il router v'è una dichiarazione di inizializzazione che passa nella variabile 'biblioteca':

initialize: function() {
            this.libraryView = new LibraryView({
                collection: window.library
            });

Ora sembra avere più senso. :)

Proprio questo distacco nel caso in cui qualcun altro è come confuso come lo ero io.

È stato utile?

Soluzione

Una collezione dovrebbe essere passato al costruttore LibraryView. Ad esempio,

myLibrary = new LibraryView({
  collection: new Albums()
})

Tuttavia, un po 'importante della magia accade qui. Tutto passato a un costruttore View finisce in della proprietà View options. Un numero selezionato di proprietà, però, ottenere copiato al vista stessa. Così si può dire che this.collection invece di this.options.collection.

Queste proprietà speciali sono:

'modello', 'collection', 'el', 'id', 'attributi', 'className', 'tagName'

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top