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

Question

我正在尝试创建一个可排序的项目列表。目前我正在使用 jQuery sortable 来实现这一点。该列表是使用 Ember View 创建的。当一个项目被删除时，我希望 Ember 模型能够用新订单进行更新。在稍后阶段，我想将其保存回服务器。

在下面的代码中，您可以看到我如何将 jQuery 代码附加到 View 元素。拖动本身工作正常，并且还调用了停止函数。

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++);
                });
            });
        }
    });

}
});

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

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

谢谢。

Answer 1

只需在函数外部保存对 Controller 的引用，以便变量在闭包中可见。然后您将可以访问 Controller 以及您的模型等。

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

由于 Controller 通常在 View 的整个生命周期中保持不变，因此这是安全的，并且比保存对模型本身的引用更好，因为您的模型可能会发生变化。