2011-03-06 13 views
7

मैं वर्तमान में बैकबोन.जेएस को रेल ऐप के साथ कोशिश कर रहा हूं। मेरी समस्या यह है कि मुझे नहीं पता कि बैकबोन नियंत्रकों को कैसे कार्यान्वित किया जाए और मेरे रेल ऐप के साथ विचार कैसे करें। मैंने बहुत सारे ट्यूटोरियल पढ़े हैं, लेकिन वे हमेशा backbone.js में केवल एक नियंत्रक का उपयोग कर रहे हैं।रेल के साथ Backbone.js

उदाहरण के लिए, मेरे पास रेल में दो नियंत्रक हैं।

  • क्रियाएँ नियंत्रक
    • दो दृश्य, एक गूगल मानचित्र और एक खोज क्षेत्र भी शामिल है। Google मानचित्र रीढ़ की हड्डी के दृश्य के साथ डाला गया है, सर्चफील्ड HTML में है और रीढ़ की हड्डी के दृश्य के माध्यम से इसकी कार्यक्षमता प्राप्त करता है।
    • खोज क्षेत्र को मेरे रेल मॉडल से डेटा प्राप्त करना चाहिए और मानचित्र के अंदर मार्कर प्रदर्शित करना चाहिए।

और दूसरी एक

  • उपयोगकर्ता नियंत्रक
    • यहाँ उन प्रोफ़ाइल देखा जाता है, और मैं अद्यतन करने के मूल्यों और अन्य बातों के
    जैसे कुछ ajax कार्यक्षमता जोड़ने के लिए चाहते हैं

मेरी application.js में मैं

var App = { 
    Views: {}, 
    Controllers: {}, 
    Collections: {}, 
    init: function() { 
     new App.Controllers.Activities(); 
     new App.Controllers.Users(); 
     Backbone.history.start(); 
    } 
}; 

$(function() { 
    App.init(); 
}); 

समस्या है का उपयोग करते हुए, कि मैं अपने उपयोगकर्ता प्रोफ़ाइल में क्रियाएँ नियंत्रक और रेल क्रियाएँ नियंत्रक में उपयोगकर्ता नियंत्रक की जरूरत नहीं है अनुप्रयोग शुरू करते हैं। मैं इसे कैसे हल कर सकता हूं? क्या मुझे जावास्क्रिप्ट के भीतर वर्तमान यूआरएल पढ़ने की कोशिश करनी चाहिए और फिर तय करें कि कौन से नियंत्रक का उपयोग किया जाता है? या मुझे जावास्क्रिप्ट फ़ाइल को application.html.erb में रखना चाहिए और फिर यहां तय करें कि कौन से नियंत्रक का उपयोग किया जाना चाहिए?

या यह backbone.js नियंत्रकों का उपयोग करने का गलत तरीका है?

मैं sth backbone.js की संरचना के साथ गलत मिल रहे हैं? या मैं नियंत्रकों का गलत तरीके से उपयोग कर रहा हूं?

एक और सवाल, कैसे Backbone.js के माध्यम से थोड़ा जावास्क्रिप्ट, विशेष रूप से jQuery में, कार्यक्षमता जोड़ने के लिए है? उदाहरण के लिए, जब मैं क्षेत्र में क्लिक करता हूं, तो मैं फ़ील्ड के अंदर लेबल को हटाना चाहता हूं। या मैं कुछ टैब-कार्यक्षमता करना चाहता हूं और कुछ तत्वों की दृश्यता को टॉगल करना चाहता हूं। क्या मुझे प्रत्येक तत्व के लिए बनाना चाहिए जो जावास्क्रिप्ट को बैकबोन व्यू का उपयोग कर रहा है? या यह अधिभार है?

आशा मैं अपने आप को स्पष्ट कर दिया और किसी को भी मदद कर सकते हैं, THX!

उत्तर

2

क्यों नहीं मार्गों के उपयोग की सुविधा रीढ़ जो विधि कॉल करने का फैसला करने के प्रदान करता है? गतिविधियों नियंत्रक में केवल गतिविधियों के लिए मार्गों का उपयोग होता है, उपयोगकर्ता नियंत्रक केवल उपयोगकर्ता हैंडलिंग के लिए, और बहुत आगे। इस तरह आप नियंत्रक को तत्काल कर सकते हैं जैसे आप करते हैं और रूटिंग तय करेगा कि वर्तमान स्थान के हैश के आधार पर क्या होता है।

आप हैश के साथ लिंक का उपयोग नहीं कर सकते (या वहाँ अपने पृष्ठ पर इस तरह का कोई लिंक हैं), मैं बस मेरे विचार काफी विशेष जब जरूरत केवल वर्तमान दृश्य के लिए घटनाओं संलग्न करने के लिए कंटेनर का नाम था।

jQuery प्लगइन्स आदि आईएमओ विचारों में हैं।आपके टैब और इनपुट संकेत टॉगल के लिए ही चला जाता है।

अद्यतन

एक सामान्य स्तर पर (और मैं नहीं जरूरी यह इस तरह से कर रही है की सिफारिश करेंगे): यदि आप दो तरीकों हों:

// should be only called for the 'Foo' controller 
function foo() { 
    alert("FOO"); 
}; 

// should be only called for the 'Bar' controller 
function bar() { 
    alert("BAR"); 
}; 

और चाहते हैं का केवल एक कॉल करने के लिए वर्तमान रेल नियंत्रक के आधार पर, एक छोटा सा सहायक बनाएं:

उदा। में आप * सहायकों/application_helper.rb *

def body_class 
    controller.controller_name 
end 

तो अपने लेआउट फ़ाइल में इस विधि कॉल (या आंशिक शीर्षक):

<body class="<%= body_class %>"> 
… 

और प्रयोग उदा jQuery के लिए "विभाजन" अपने जे एस निष्पादन:

if ($('body').hasClass('foo')) { 
    foo(); 
} else if ($('body').hasClass('bar')) { 
    bar(); 
} 
+0

मार्गों का उपयोग करना एक अच्छा विचार है! लेकिन जैसा कि आपने कहा था कि मेरे यूआरएल में इसमें हैश नहीं है। मैं मानक रेल मार्गों का उपयोग कर रहा हूँ।क्या कोई बेहतर तरीका है कि कौन सा नियंत्रक चुनने का फैसला करता है? या शायद मैं backbone.js कांटा और इस कार्यक्षमता को जोड़ देंगे। तुम क्या सोचते हो? – 23tux

+0

मुझे नहीं लगता कि एक कांटा जरूरी है। आपके नियंत्रक केवल कक्षाएं हैं, कुछ भी वास्तव में तब तक नहीं होना चाहिए जब तक कि आप इन वर्गों में से किसी एक को कॉल न करें। क्या आप समझा सकते हैं कि आप अपने नियंत्रकों के भीतर क्या कर रहे हैं जो आपको इस तरह से कोड को "विभाजित" करना चाहते हैं? (अधिक सामान्य स्तर पर: मैं अपने उत्तर में मौजूदा रेल नियंत्रक के आधार पर जेएस को आमंत्रित करने का एक और तरीका जोड़ूंगा।) – polarblau

+0

thx आपके लिए टिप्पणी और आपके अपडेट के लिए। लेकिन मुझे इस विधि को पसंद नहीं है कि सीएसएस यह तय करने में शामिल है कि कौन से नियंत्रक का उपयोग किया जाना चाहिए। मैं इस कोड को इस तरह से विभाजित करना चाहता हूं, क्योंकि मुझे लगता है कि अन्य नियंत्रकों के अलावा गतिविधियों नियंत्रक के जावास्क्रिप्ट कोड को रखना स्पष्ट है। उदाहरण के लिए, मेरे पास गतिविधियों नियंत्रक और उपयोगकर्ता नियंत्रक में एक मानचित्र है। दृश्य एक जैसा है, लेकिन व्यवहार अलग है। एक और बात यह है कि, मैं इसे विशेष रेल विधि के भीतर कैसे संभाल सकता हूं (मान लें, कोड केवल नियंत्रक की विधि से संबंधित है, उदाहरण के लिए नई क्रिया)? – 23tux

1

मैं व्यक्तिगत रूप से jammit (रीढ़ की हड्डी का एक ही लेखक की ओर से) का उपयोग करें। आप मॉड्यूल द्वारा स्टाइलशीट्स और जावास्क्रिप्ट फ़ाइलों को समूहबद्ध कर सकते हैं और उन्हें अपने विभिन्न पृष्ठों पर उपयोग कर सकते हैं। तो आप अपनी गतिविधियों के दृश्य के लिए एक मॉड्यूल बनाते हैं और दूसरा आपके उपयोगकर्ता के लिए जरूरी जावास्क्रिप्ट फ़ाइल की आवश्यकता होती है। इस बारे में दो अच्छा बातें:

  • आप केवल कोड पेज पेज पर लोड पर इस्तेमाल किया है
  • jammit सब कुछ के लिए आप

इस तरह है, जब एक ही पृष्ठ बनाने नहीं जाना comprsses वेब ऐप जहां आप एक नियंत्रक से दूसरे नियंत्रक पर नेविगेट करने के लिए # मार्गों पर निर्भर करते हैं। आपके मामले में आपके पास मुख्य रेल ऐप के अंदर एकाधिक एकल पृष्ठ ऐप्स हैं।

+0

जैमिट ऐसा करने का एक अच्छा तरीका हो सकता है। लेकिन मैं सोच रहा हूं कि प्रदर्शन की समस्या हो सकती है या नहीं। चूंकि आप प्रत्येक नियंत्रक के लिए एक ही फ़ाइल में जावास्क्रिप्ट फ़ाइलों को संपीड़ित करते हैं, इसलिए आप प्रत्येक नियंत्रक (या प्रत्येक क्रिया के लिए भी) के लिए एक अद्वितीय फ़ाइल बनाते हैं। इसलिए हर बार जब आप एक नए पेज तक पहुंचते हैं, तो पूरे बैकबोन.जेएस और (मेरे मामले में) jQuery ढांचे को लोड किया जाता है, क्योंकि यह एक फ़ाइल में शामिल होता है। मैं इसे कैसे संभाल सकता हूं? जैमिट के अलावा बैकबोन.जेएस और jQuery को रखते हुए? लेकिन फिर मैं इस तथ्य से लाभ नहीं उठा सकता, कि मेरे पास केवल एक जेएस फ़ाइल है और HTTP अनुरोध की एक छोटी संख्या है। तुम क्या सोचते हो? – 23tux

+0

मेरे पास jQuery और रीढ़ की हड्डी के साथ एक सामान्य.जेएस फ़ाइल है और रेल दृश्यों के सेट के लिए एक जेएस फ़ाइल है। यह 2 अनुरोध होगा और एक बार common.js फ़ाइल लोड हो जाती है (और कैश), 1 अनुरोध। जैमिट एक संपत्ति फ़ोल्डर में फ़ाइलों को संपीड़ित करेगा जो यह उत्पादन परिनियोजन के लिए उपयोग करेगा। इस माहौल में कोई संपीड़न नहीं। – Julien

+0

ध्यान दें कि रेल 3.1 में, संपत्ति पाइपलाइन सुविधा जैमिट करता है (जेएस, सीएसएस के लिए), जो फ़ाइलों में कार्यक्षमता के अच्छे अलगाव की इजाजत देता है। एक छोटे ऐप के लिए, डिफ़ॉल्ट व्यवहार बेहतर होता है - सभी जेएस को एक फ़ाइल में छोटा/डी-टिप्पणी/आदि मिल जाता है, जिसे ब्राउज़र पर स्थानीय रूप से कैश किया जाता है। बहुत से ऐप्स मैनिफेस्ट विकल्पों का उपयोग यह निर्धारित करने के लिए कर सकते हैं कि फ़ाइलों को कैसे पैक किया जाता है और जब उन्हें भेजा जाता है। –

1

Im a backbone.js newb, तो अगर कोई गलत है तो कृपया मुझे सही करें, लेकिन मुझे लगता है कि आप भ्रमित हैं कि बैकबोन नियंत्रकों के लिए क्या उपयोग किया जाता है।

बैकबोन.जेएस नियंत्रक मूल रूप से हैशबैंग मार्ग (रेल मार्गों के समान) और इन मार्गों को कॉल करते हैं। उदाहरण के लिए यदि आप एक रेल मार्ग कि http://mysite.com/backbone_test पर एक दृश्य प्रस्तुत करना होगा और आप एक निम्नलिखित रीढ़ मार्ग है, तो:

var MyController = Backbone.Controller.extend({ 
    routes: { 
    "foo/:bar":   "myFirstFunction" 
    }, 
    myFirstFunction: function(bar){ 
    console.log(bar); 
    }); 

फिर अगर आप को http://mysite.com/backbone_test#foo/THIS-IS-AMAZING तो MyController.MyFirstFunction निष्पादित हो जाता है जाने के लिए और "यह-IS-अद्भुत" जेएस कंसोल में लॉग हो जाता है।

जब तक आप इस तरह के एक यूआरएल (उदाहरण के लिए: http://my.app.com/#key=value&key=value&ad-infinitum=true) के माध्यम से अपने जावास्क्रिप्ट आवेदन के एक राज्य को बचाने के रूप में hashbang से संबंधित कार्यक्षमता, इस तरह की के लिए एक सीधा जरूरत है ईद सलाह बैकबोन नियंत्रकों का उपयोग कर के खिलाफ। आप मॉडल संग्रह और दृश्यों के माध्यम से वर्णित सभी कार्यक्षमताओं को प्राप्त कर सकते हैं।

सामान्य रूप से नियंत्रकों और रीढ़ की हड्डी के बारे में अच्छी बात यह है कि इसके मॉड्यूलर और विभिन्न भागों को स्वतंत्र रूप से उपयोग किया जा सकता है।

मुझे लगता है कि इस उत्तर का सारांश यह है कि यदि आपके पास एक पृष्ठ जावास्क्रिप्ट एप्लिकेशन नहीं है, तो बैकबोन कंट्रोलर का उपयोग न करें, इसके बजाय अपने रेल नियंत्रकों पर भरोसा करें।

+0

आपकी टिप्पणी के लिए thx, लेकिन मुझे लगता है कि यदि आपके पास एक पृष्ठ जावास्क्रिप्ट ऐप नहीं है तो भी जब आप जावास्क्रिप्ट भाग बड़ा हो जाते हैं तो आप Backbone.js का उपयोग कर सकते हैं (या चाहिए)। मैं रीस्टफुल तरीके का उपयोग करने में सक्षम होना चाहता हूं Backbone.js मेरे नियंत्रकों के साथ संचार कर रहा है। – 23tux

+1

मैंने नहीं कहा था कि आपको Backbone.js का उपयोग नहीं करना चाहिए। वास्तव में, मुझे बैकबोन.जेएस पसंद है क्योंकि यह आपको अपने जावास्क्रिप्ट कोड को संरक्षित करने और स्पेगेटी कोड जाल से बचने के लिए मजबूर करता है। मैंने जो कहा वह यह है कि आपको हमेशा Backbone.js नियंत्रक का उपयोग करने की आवश्यकता नहीं है, विशेष रूप से यदि आपको अपने आवेदन में हैशटैग किए गए मार्गों की आवश्यकता नहीं है। –

+0

उह, मुझे खेद है, मैंने आपके जवाब को गलत तरीके से पढ़ा। लेकिन मैं इस बिंदु पर आया, कि मुझे नियंत्रकों की आवश्यकता नहीं है और अन्य सामान की रीढ़ की हड्डी प्रदान करता है। अब मैं अपने मॉड्यूल के लिए require.js का उपयोग कर रहा हूं। आपके जवाब के लिए Thx! यह वास्तव में वास्तव में एक महान समुदाय है! – 23tux