2012-12-19 10 views
7

यह मेरी app.js फ़ाइल है। मुझे LandingView कक्षा के navigateToLogin विधि के भीतर राउटर की navigate विधि तक पहुंचने की आवश्यकता है। लेकिन चूंकि ऐप राउटर को देखने के बाद परिभाषित किया गया है, इसलिए यह राउटर को दृश्य के भीतर से पहचान नहीं सकता है। इसलिए मुझे किसी वर्ग या विधि से राउटर तक वैश्विक रूप से पहुंचने का एक तरीका ढूंढना होगा। मैं इस समस्या के आसपास कैसे हो सकता हूं?रीढ़ की हड्डी में वैश्विक स्तर पर राउटर का उपयोग कैसे करें?

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(); 
+0

लुकास का उत्तर इस प्रश्न का स्वीकार्य उत्तर होना चाहिए। –

उत्तर

20

आप रीढ़ के कोड में एक छोटे से खुदाई, तो आप बदले में navigate की रूटर के कार्यान्वयन कॉल Backbone.history.navigate पर ध्यान देंगे:

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

बजाय स्पष्ट रूप से वैश्विक क्षेत्र को mucking की, Backbone.history.navigate का उपयोग करें:

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

मैंने नेविगेशन समस्या हल की। मैंने नेविगेट फ़ंक्शन में स्लेश छोड़े और यह काम किया :) लेकिन जानकारी के लिए धन्यवाद। यह जानना दिलचस्प है कि किसी समस्या को हल करने के लिए हमेशा एक से अधिक तरीके हैं :) – jaykumarark

+0

+1: यह एक अच्छा जवाब है। बहुत बहुत धन्यवाद! –

+0

यह स्वीकार्य उत्तर होना चाहिए। –

7

आप appRouter की जरूरत है विश्व स्तर पर सुलभ होने के लिए आपको कुछ वैश्विक वस्तु में अटैच कर किया है। वेब ब्राउज़र में यह window ऑब्जेक्ट है। खिड़की के माध्यम से

window.app = new appRouter(); 

और पहुँच यह:

window.app.navigate(...); 

का उपयोग करते हुए वैश्विक कोड है कि बनाए रखने के लिए मुश्किल है हो सकता है। यदि आपका ऐप तुच्छ आकार का नहीं है, तो कुछ डीकौप्लिंग तंत्र का उपयोग करने पर विचार करें, जैसे कि mediator pattern

+0

वैसे मैं एक छोटा ऐप बना रहा हूं जो शैक्षणिक उद्देश्यों के लिए काफी प्रबंधनीय और पूरी तरह से है। इसने काम कर दिया। धन्यवाद :) – jaykumarark

+0

'\t मार्गों: { \t" ":" init " \t"/लॉगिन ":" loadLogin ", \t},' मेरे रूटर मेरी रूटर के loadLogin समारोह को गति प्रदान करने प्रतीत नहीं होता। क्या उपर्युक्त कथन में कुछ गड़बड़ है? – jaykumarark

+0

@Jaykumarark सुनिश्चित नहीं है, बिना आगे के स्लैश के मार्ग को परिभाषित करने का प्रयास करें। – jevakallio

संबंधित मुद्दे