Backbone.js avec $ .getScript Extension modèle

Question

J'ai créé un nouveau modèle Backbone.js widget de qui je l'espère étendre:

        var Widget = Backbone.Model.extend({
            constructor: function() {
              console.log('Widget constructor called.');
            }
        });

En fonction de la page d'un utilisateur affiche un certain nombre de widgets sera chargé via Ajax, donc pour chaque widget de je vais faire quelque chose comme ceci:

        $.getScript('widgets/widget1', function(xhr){
            var widget1 = new pieChartWidget();
            widget1.render();
            widget1.update();
        });

Contenu de "widgets / widget1":

$(function() {

    var pieChartWidget = Widget.extend({
            render: function(json) {
              console.log('Widget render called.'); 
            },
            update: function(json) {
              console.log('Widget update called.'); 
            }
    });

});

Dans ma console Firebug j'obtiens « pieChartWidget n'est pas défini ». Je sais que le Javascript est chargé avec succès, je ne peux pas étendre le modèle « Widget » de celui-ci.

Answer 1

Votre widget est défini dans une fonction. Donc, toutes les variables déclarées ne sont visibles alors portée sont acceptés dans les fonctions.

$(function() {

  var pieChartWidget;

  // pieChartWidget is only visible here!

});

// pieChartWidget not visible here!

Pour accéder au widget de l'extérieur de la fonction que vous devez l'affecter à un (espace de noms, par exemple. Vos applications) variable globale. Vous pouvez également utiliser la fenêtre (et non la préférence).

Votre code devrait fonctionner sans changement si vous cédez votre widget à la fenêtre comme ceci:

$(function() {

  window.pieChartWidget = Widget.extend({
        render: function(json) {
          console.log('Widget render called.'); 
        },
        update: function(json) {
          console.log('Widget update called.'); 
        }
});

});