Backbone.js - Comment est la vue trouvent cette collection?

Question

Je vais à travers un tutoriel pour apprendre à utiliser Backbone.js et je vais avoir du mal à comprendre comment des vues Backbone sont « voir » la collection.

Voici le code de vue, et au-dessous qui est le code Collection.

Je peux voir que la variable albums $ est affecté à la classe particulière » .albums' qui est dans l'élément, mais je ne comprends pas comment ce code fait référence à « this.collection ».

Tant la vue et la collection sont en cours d'extension des classes standards Backbone.View et Backbone.Collection. Juste de regarder, je ne vois pas comment ils savent même l'autre exist. Je suppose que le mot « ceci » fait référence à ce cas particulier de LibraryView.

Je suppose que cela est ma première question:

Comment est-ce que le collection = this.collection de code est capable de voir la collection externe?

// 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;
        }

    });

Voici la collection Albums:

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

EDIT:

---

Je pense que je l'ai trouvé grâce à l'aide ici:

Il y avait un autre morceau de code créant une variable bibliothèque et l'affecter à une nouvelle collection d'albums:

window.library = new Albums();

En outre, dans le routeur il y a une instruction d'initialisation qui passe dans la variable « bibliothèque »:

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

Maintenant, il semble plus logique. :)

Il suffit de poster ce dans le cas où quelqu'un d'autre est aussi confus que moi.

Answer 1

Une collection devrait être transmis au constructeur LibraryView. Par exemple,

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

Cependant, un peu important de la magie qui se passe ici. Tout est passé à un constructeur Voir finit dans la propriété de options de vue. Un certain nombre de propriétés que, seront copiés sur le point de vue elle-même. Ainsi, vous pouvez dire this.collection au lieu de this.options.collection.

Ces propriétés spéciales sont:

'modèle', 'collection', 'el', 'id', 'attributs', 'className', 'tagName'