बैकबोन लाने का उचित तरीका

Question

मेरा बैकबोन एप्लिकेशन शेड्यूल नामक एक दृश्य है, मैं सफलता और त्रुटि पर उचित फ़ंक्शन को कॉल करने के अंतर के बारे में थोड़ा उलझन में हूं, मुझे नीचे सूचीबद्ध दोनों टॉव की कोशिश की गई है, लेकिन मैं नहीं था अंतर क्या है और क्या सही तरीके से बाहर दृश्य में रखा रूटर से एक समारोह कॉल करने के लिए है:

पहला तरीका:

 require([ 
      'app/collections/schedule', 
      'app/views/schedule' 
     ], function(ScheduleCollection, ScheduleView) { 

      var scheduleCollection = new ScheduleCollection(), 
      scheduleView = new ScheduleView({ 
       model: scheduleCollection 
      }); 

      scheduleCollection.fetch({ 
       reset: true,     
       success: function(){ 
        scheduleView.successHandler(); 
       }, 
       error: function(){ 
        scheduleView.errorHandler() 
       } 
      }); 
     }); 

दूसरा तरीका

 require([ 
      'app/collections/schedule', 
      'app/views/schedule' 
     ], function(ScheduleCollection, ScheduleView) { 

      var scheduleCollection = new ScheduleCollection(), 
      scheduleView = new ScheduleView({ 
       model: scheduleCollection 
      }); 

      scheduleCollection.fetch({ 
       reset: true,     
       success: scheduleView.successHandler(), 
       error: scheduleView.errorHandler()     
      }); 
     }); 

scheduleView

successHandler: function(){ 
    console.log('success'); 
} 


erroHandler: function(){ 
    console.log('error'); 
} 

Answer 1

पहले रास्ते में दूसरा गलत है सही है, तो। लेकिन इस तरह से सबसे संक्षिप्त होगा:

scheduleCollection.fetch({ 
    reset: true,     
    success: scheduleView.successHandler, 
    error: scheduleView.errorHandler 
}); 

(हालांकि ... ओ पी से, समारोह scheduleView.successHandler मौजूद नहीं है, तो यह है कि एक समस्या हो सकती है।)

Answer 2

आपको क्या करने की जरूरत है असाइन है फ़ंक्शन ऑब्जेक्ट को 'सफलता' और 'त्रुटि' और फ़ंक्शन का रिटर्न वैल्यू नहीं। जब आप ऐसा करेंगे:

function(){...} 

यह एक समारोह वस्तु और इसलिए सफलता देता है: function() {...}

सही है लेकिन अगर

a = function(){...} 

और आप यह कर a() फ़ंक्शन निष्पादित करता है और वापसी मान देता है और इसलिए success: a() गलत है लेकिन success: a सही है।

Answer 3

आपका दूसरा काम नहीं करने का कारण यह है कि आपको किसी फ़ंक्शन को तत्काल निष्पादित करने के बजाय संदर्भित करने की आवश्यकता है।

var foo = myFunction(); // foo is set to myFunction's return value 
var bar = myFunction; // bar is set to a REFERENCE to myFunction 

foo === bar // FALSE 
bar === myFunction // TRUE 

सही कोड:

scheduleCollection.fetch({ 
    reset: true,     
    success: scheduleView.successHandler, 
    error: scheduleView.errorHandler     
}); 

अब, आप वापस आ एक्सएचआर वस्तु के बंद उन्नत पाने के लिए, jQuery promise API का उपयोग कर चाहते हैं, तो हर तरह से बेहतर है और कॉलबैक अब आवश्यक नहीं होना चाहिए।

scheduleCollection.fetch({ reset: true }) 
    .then(scheduleView.successHandler, scheduleView.errorHandler); 

अंतर यह है कि आप एक वादा पीठ पर पारित किया जा सकता है कि मिल गया है ... लेकिन यह है कि एक अलग पोस्ट के लिए एक विषय है। (बेशर्म प्लग) मेरे वादे पर तीन भाग श्रृंखला के लिए adamterlson.com की जाँच करें ....

Answer 4

वहाँ एक और विकल्प है: बजाय सीधे विचारों को संदर्भित से संबंधित विचारों के लिए एक संदर्भ के रूप में संग्रह प्रदान करते हैं और प्रासंगिक घटनाओं के लिए सुनने। उदाहरण के लिए, संबंधित दृश्य में संग्रह पर रीसेट करने के लिए सुनो। यदि वह ईवेंट नहीं है जिसे आप हुक करना चाहते हैं, तो सफलता/त्रुटि कॉलबैक से एक कस्टम ईवेंट ट्रिगर करें जो आपका दृश्य सुन सकता है।

यहाँ एक उदाहरण से निपटने रीसेट है - अपने ScheduleView का विस्तार:

var ScheduleCollection = Backbone.Collection.extend({ 

    getResults: function() { 

     var self = this; 

     this.fetch({ 
      reset: true, 
      success: function (collection, response, options) { 
       // you can pass additional options to the event you trigger here as well 
       self.trigger('successOnFetch'); 
      }, 
      error: function (collection, response, options) { 
       // you can pass additional options to the event you trigger here as well 
       self.trigger('errorOnFetch'); 
      } 
     }); 
    } 
}; 

var ScheduleView = Backbone.View.extend({ 

    initialize: function() { 

     this.listenTo(this.collection, 'successOnFetch', this.handleSuccess); 
     this.listenTo(this.collection, 'errorOnFetch', this.handleError); 
    }, 

    handleSuccess: function (options) { 
     // options will be any options you passed when triggering the custom event 
    }, 

    handleError: function (options) { 
     // options will be any options you passed when triggering the custom event 
    } 
}; 

var scheduleCollection = new ScheduleCollection(); 
var scheduleView = new ScheduleView({ collection: scheduleCollection }); 
scheduleCollection.getResults(); 

तारों अप का लाभ:

var ScheduleView = Backbone.View.extend({ 

    initialize: function() { 

     this.listenTo(this.collection, 'reset', this.handleReset); 
    }, 

    handleReset: function() { 
     // do whatever you need to do here 
    } 
}; 

var scheduleCollection = new ScheduleCollection(); 
var scheduleView = new ScheduleView({ collection: scheduleCollection }); 

यहाँ कस्टम घटनाओं संग्रह से सफलता/त्रुटि संचालकों से बंधा का एक उदाहरण है इस तरह आप संग्रह पर निर्भरता को निर्भर करते हैं। यह विशेष रूप से महत्वपूर्ण है यदि आप अपने संग्रह (या आप संग्रह मॉडल) पर होने वाली घटनाओं को सुनने के लिए एक से अधिक दृश्य चाहते हैं और आपके बैकबोन एप्लिकेशन के लिए एक अधिक कमजोर युग्मित आर्किटेक्चर है।