jquery-ui - 如何在 Marionette.ItemView 中监听 jquery-ui 事件

Question

我确实有一些动态加载的 ItemViews 加载到布局区域中。模板包含 jquery-ui 组件，例如滑块“#mySlider”。我确实使用 Maronette.Region onShow 事件初始化组件。我的观点是这样的：

var MyView = Backbone.Marionette.ItemView.extend({
  template: '#my-tpl',

  initialize: function() {
     _.bindAll(this);
  },

  onShow: function(){
   $('#mySlider').slider({
    min: 1,
    max: 10,
    slide: function( event, ui ) {
      //some code here to update the the Views model, like
      //this.model.set({'stroke': ui.value});
   }});

  .....

显然这不起作用，因为 this.model 在#mySlider 中没有像这样定义。如何正确执行此操作并将 jquery-ui 事件捕获为 Marionette.ItemView 事件？

Answer 1

一个简单的关闭就可以了。

小提琴：http: //jsfiddle.net/puleos/z7QsC/

var SliderView = Marionette.ItemView.extend({
    template: "#slide-template",
    initialize: function() {
      _.bindAll(this);
    },
    onShow: function() {            
      var self = this; 

      $('#slider-range').slider({
        min: 1,
        max: 10,
        slide: self.updateSlider
      });
    },
    updateSlider: function(event, ui) {
        this.model.set({'stroke': ui.value});
    }
});