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

Question

我正在嘗試創建可排序的項目列表。 目前，我正在為此使用jQuery sortable。 該列表是使用Ember視圖創建的。 放下物品時，我希望用新訂單更新Ember模型。 在稍后的階段，我想將其保存回服務器。

在下面的代碼中，您可以看到我如何將jQuery代碼附加到view元素。 拖動本身可以完美工作，並且還調用了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視圖。 這就是我要存儲在模型中的內容。 不幸的是，我似乎無法訪問該模型。

任何有關如何執行此操作的想法將不勝感激。

謝謝。

Answer 1

只需在函數外保存對控制器的引用，以使變量在閉包中可見。 然后，您將可以訪問控制器，從而可以訪問模型等。

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

由於控制器通常在視圖的整個生命周期中保持不變，因此這是安全的，並且比保存對模型本身的引用要好，因為模型可能會更改。

Answer 2

您可以訪問控制器，也可以從控制器訪問模型。

this.get('controller').get('model')或您也可以將上下文傳遞給視圖，該上下文可以是您的模型。 {{查看Scrum.Sortable context = this}}