使用EmberJS捕获动态生成的复选框checked事件

Question

嗨我在我的应用程序中使用emberjs和mapbox.js，并根据mapboxjs它会自动显示地图，并一旦我的页面加载在地图上[叠加] [复选框]

App.FullMap = Ember.View.extend({ 

/** 
* Public construction properties 
*/ 
vehicles: [], 

/** 
* Private properties & methods 
*/ 
_vmarkers: [], 
classNames: ['map full-map'], 


didInsertElement: function() { 
    this.map = L.map(this.get('element'), { 
     minZoom: 4, 
     maxZoom: 16, 
     attributionControl: false, 
     worldCopyJump: true 
    }); 

    this.set('controller.map', this.map); 
    var overlays = []; 
    overlays['2 wheelers'] = {name:"2 wheelers"}; 
    overlays['3 wheelers'] = {name:"3 wheelers"}; 
    overlays['4 wheelers'] = {name:"4 wheelers"}; 
    overlays['Heavy Load'] = {name:"Heavy Load"}; 


    // Build the layer control 
    _.maps.layerControl(this.map, 'topleft', { 
     normal: true, 
     satellite: true 
    }, overlays); 

$('.leaflet-map-pane').addClass('normal-view'); 
    this.createMarkers(); 

    }); 

在HBS加载该视图中mapbox如下

<div class="leaflet-control-layers-overlays"> 
    <label><input type="checkbox" class="leaflet-control-layers-selector<span>   2   wheelers</span></label> 
     <label><input type="checkbox" class="leaflet-control-layers-selector"><span> 3 wheelers</span></label> 
     <label><input type="checkbox" class="leaflet-control-layers-selector"><span> 4 wheelers</span></label> 
     <label><input type="checkbox" class="leaflet-control-layers-selector"><span> Heavy Load</span></label> 
    </div> 

现在将autoamtically genrate这些复选框叠加后我的问题是如何访问使用烬复选框财产，因为复选框会自动呈现b y添加了地图BoxJS的叠加层，并且我将如何检查复选框。 基于复选框事件我要地图

上显示标记列表请帮我打电话给基础上的复选框事件

 this.createMarkers(); 

Answer 1

我想你可能有jQuery来处理这此功能。在didInsertElement的末尾添加一个jQuery事件监听器上的复选框：

didInsertElement: function() { 
    var that = this; 

    // Other mapbox code here... 

    this.$('.leaflet-control-layers-selector:checkbox').on('change', function() { 
     that.createMarkers(); // Call your function here. Use `that` rather than `this` to access the parent scope 
    }); 
}, 

和视图被销毁前别忘了清除事件：

willDestroyElement: function() { 
    this.$('.leaflet-control-layers-selector:checkbox').off('change'); 
},