在jQuery事件处理程序闭包中使用Ember.js模型

时间:2013-10-14 11:49:37

标签: javascript jquery jquery-ui ember.js ember-data

我正在尝试创建一个可排序的项目列表。此时我正在使用jQuery对此进行排序。使用Ember视图创建列表。当项目被删除时,我希望使用新订单更新Ember模型。在稍后阶段,我想将其保存回服务器。

在下面的代码中,您可以看到我如何将jQuery代码附加到视图元素。拖动本身效果很好,也会调用stop函数。

Scrum.Sortable  = Ember.View.extend({
tagName :   'div',
didInsertElement:   function(){
    this.$().sortable({
        placeholder: "ui-state-highlight",
        stop:function(){
            var order   = 1;
            $('div.pb-item').children().each(function(index){
                $(this).find('.order').each(function(){
                    //
                    // Access and save the model here
                    //
                    $(this).html(order++);
                });
            });
        }
    });

}
});

您还可以看到我手动更新视图html。这就是我想要存储在模型中的内容。不幸的是,我似乎无法访问该模型。

非常感谢任何关于如何做到这一点的想法。

感谢。

2 个答案:

答案 0 :(得分:2)

只需在函数外部保存对控制器的引用,以便变量在闭包中可见。然后你就可以访问控制器,从而访问你的模型等。

didInsertElement: function() {
  controller = this.get('controller')
  ...
    $(this).find('.order').each(function(){
      // Here you have access to the controller variable.
    });
  ...
}

由于控制器在视图的整个生命周期中通常保持不变,这是安全的,并且比保存对模型本身的引用更好,因为您的模型可能会更改。

答案 1 :(得分:1)

您可以访问控制器并从控制器访问模型。

this.get('controller').get('model')或者您也可以将视图传递给您的视图,这可能是您的模型。 {{view Scrum.Sortable context = this}}