Wie Router global in Backbone-Js zugreifen?

Question

Dies ist meine app.js-Datei. Ich muss auf die navigate Methode des Routers innerhalb der navigateToLogin Methode der LandingView Klasse zurückgreifen. Da der appRouter jedoch nach der Ansicht definiert ist, kann er den Router nicht innerhalb der Ansicht erkennen. Also muss ich einen Weg finden, global von jeder Klasse oder Methode auf den Router zuzugreifen. Wie kann ich dieses Problem umgehen?

var LandingView = Backbone.View.extend({ 
    tagName: 'div', 
    id: 'landing', 
    className: 'landingpad', 
    events: { 
     'click button#login': 'navigateToLogin', 
    }, 
    render: function(){ 

     (this.$el).append("<button class='button' id='login'>Login</button><br/><br/><br/>"); 
     (this.$el).append("<button class='button' id='new'>New User?</button>"); 

     console.log(this.el); 
     return this; 
    }, 
    navigateToLogin: function(e){ 
     app.navigate("/login", true); 
     return false; 
    }, 
}); 

var appRouter = Backbone.Router.extend({ 

initialize: function(){ 
    $('#content').html(new LandingView().render().el); 
} 
}); 

    app = new appRouter(); 

Answer 1

Wenn Sie in Backbone der Code ein wenig zu graben, werden Sie, dass die Umsetzung von navigate wiederum Router bemerken ruft Backbone.history.navigate:

// Simple proxy to `Backbone.history` to save a fragment into the history. 
navigate: function(fragment, options) { 
    Backbone.history.navigate(fragment, options); 
} 

Anstatt also explizit den globalen Bereich Ausmisten, verwenden Backbone.history.navigate:

var LandingView = Backbone.View.extend({ 
    ... 
    navigateToLogin: function(e){ 
     Backbone.history.navigate("/login", true); 
     return false; 
    }, 
}); 

Answer 2

Wenn Sie appRouter müssen zugänglich global sein, müssen Sie es bis zu einem gewissen globales Objekt anhängen. In Webbrowsern ist dies das Objekt window.

window.app = new appRouter(); 

und greifen Sie über Fenster:

window.app.navigate(...); 

Mit Globals zu Code führen kann, die zu halten ist schwierig. Wenn Ihre App keine triviale Größe hat, sollten Sie einen Entkopplungsmechanismus wie den mediator pattern verwenden.