Başka bir görünümden görünüm işlevi çağırma - Backbone

Question

Uygulamamda aşağıdaki görünümlerim var. Temel olarak App.HouseListElemView li tıklandığında App.MapView içinde show_house() aramak istiyorum.

Bunu yapmanın en iyi yolu ne olurdu? app_state bir değer ayarlayarak

var AppState = Backbone.Model.extend({ /* maybe something in here, maybe not */ }); 
var app_state = new AppState; 

Sonra HouseListElemView tıklama yanıt verebilir:

App.HouseListElemView = Backbone.View.extend({ 
    tagName: 'li', 
    events: { 
     'click': function() { 
      // call show_house in App.MapView 
     } 
    }, 
    initialize: function() { 
     this.template = _.template($('#house-list-template').html()); 
     this.render(); 
    }, 
    render: function() { 
     var html = this.template({model: this.model.toJSON()}); 
     $(this.el).append(html); 
    }, 
}); 

App.MapView = Backbone.View.extend({ 
    el: '.map', 
    events: { 
     'list_house_click': 'show_house', 
    }, 
    initialize: function() { 
     this.map = new GMaps({ 
      div: this.el, 
      lat: -12.043333, 
      lng: -77.028333, 
     }); 
     App.houseCollection.bind('reset', this.populate_markers, this); 
    }, 
    populate_markers: function(collection) { 
     _.each(collection.models, function(house) { 
      var html = 'hello' 
      this.map.addMarker({ 
       lat: house.attributes.lat, 
       lng: house.attributes.lng, 
       infoWindow: { 
        content: html, 
       }     
      }); 
     }, this); 
    }, 
    show_house: function() { 
     console.log('show house'); 
    } 
}); 

Answer 1

akım evin böylece küresel uygulama durumunu saklamak üzere yeni bir model oluşturmak gerçekten uygulamanızın küresel devletin bir parçasıdır : o zaman

App.HouseListElemView = Backbone.View.extend({ 
    //... 
    events: { 
     'click': 'set_current_house' 
    }, 
    set_current_house: function() { 
     // Presumably this view has a model that is the house in question... 
     app_state.set('current_house', this.model.id); 
    }, 
    //... 
}); 

ve MapView basitçeden 'change:current_house' olaylarını dinler:

App.MapView = Backbone.View.extend({ 
    //... 
    initialize: function() { 
     _.bindAll(this, 'show_house'); 
     app_state.on('change:current_house', this.show_house); 
    }, 
    show_house: function(m) { 
     // 'm' is actually 'app_state' here so... 
     console.log('Current house is now ', m.get('current_house')); 
    }, 
    //... 
}); 

Demo: http://jsfiddle.net/ambiguous/sXFLC/1/

Sen current_house gerçek modeli yerine elbette sadece id olmak isteyebilirsiniz ama bu kolay.

app_state ürününe ait her tür dosyayı bulabileceğiniz her an bulabilirsiniz. Hatta biraz REST ve AJAX ekleyebilir ve uygulama ayarlarınız için ücretsiz olarak kalıcı olabilirsiniz.

Olaylar, Backbone'daki her soruna genel bir çözümdür ve istediğiniz herhangi bir model için model oluşturabilirsiniz, hatta nesneleri birbirine yapıştırmak için geçici modeller bile yapabilirsiniz.