làm thế nào để tự động thêm các phương pháp quan sát viên đến một đối tượng Ember.js

Question

Vì vậy, tôi đang cố gắng để tự động thêm những phương pháp quan sát viên đến một đối tượng Ember.js

holderStandoutCheckedChanged: (-> 
    if @get("controller.parent.isLoaded") 
     @get("controller").toggleParentStandout(@get("standoutHolderChecked")) 
).observes("standoutHolderChecked") 

holderPaddingCheckedChanged: (-> 
    if @get("controller.parent.isLoaded") 
     @get("controller").toggleParentPadding(@get("holderPaddingChecked")) 
).observes("holderPaddingChecked") 

holderMarginCheckedChanged: (-> 
    if @get("controller.parent.isLoaded") 
     @get("controller").toggleParentMargin(@get("holderMarginChecked")) 
).observes("holderMarginChecked") 

tôi có mã này cho đến nay nhưng chức năng item.methodToCall không được gọi là

methodsToDefine = [ 
    {checkerName: "standoutHolderChecked", methodToCall: "toggleParentStandout"}, 
    {checkerName: "holderPaddingChecked", methodToCall: "toggleParentPadding"}, 
    {checkerName: "holderMarginChecked", methodToCall: "toggleParentMargin"} 
] 

add_this = { } 

for item in methodsToDefine 
    add_this["#{item.checkerName}Changed"] = (-> 
     if @get("controller.parent.isLoaded") 
      @get("controller")[item.methodToCall](@get(item.checkerName)) 
    ).observes(item.checkerName) 

App.ColumnSetupView.reopen add_this 

Bất cứ ai có thể cho tôi biết tôi đang làm gì sai? Có cách nào tốt hơn để làm điều này ? Tôi có nên làm điều này trong một mixin? Nếu vậy hãy

Answer 1

Tôi không biết trường hợp sử dụng chính xác của bạn, nhưng như bạn nói, vấn đề mô tả của bạn có thể được giải quyết với một Mixin, xem http://jsfiddle.net/pangratz666/a3Usx/

Javascript:

App = Ember.Application.create(); 

var methodsToDefine = [ 
    {checkerName: "standoutHolderChecked", methodToCall: "toggleParentStandout"}, 
    {checkerName: "holderPaddingChecked", methodToCall: "toggleParentPadding"}, 
    {checkerName: "holderMarginChecked", methodToCall: "toggleParentMargin"} 
]; 

App.Stalker = Ember.Mixin.create({ 
    init: function() { 
    this._super(); 
    methodsToDefine.forEach(function(config) { 
     // add an observer for checkerName - a change should call methodToCall 
     Ember.addObserver(this, config.checkerName, this, config.methodToCall); 
    }, this); 
    }, 

    willDestroy: function() { 
    this._super(); 

    // since we are good citizens, we remove the observers when the object is destroyed 
    methodsToDefine.forEach(function(config) { 
     Ember.removeObserver(this, config.checkerName, this, config.methodToCall); 
    }, this); 
    } 
}); 

Trường hợp sử dụng mẫu:

var myObj = Ember.Object.create(App.Stalker, { 
    toggleParentStandout: function() { 
    console.log("toggleParentStandout called"); 
    }, 
    toggleParentPadding: function() { 
    console.log("toggleParentPadding called"); 
    }, 
    toggleParentMargin: function() { 
    console.log("toggleParentMargin called"); 
    } 
}); 

myObj.set('standoutHolderChecked', 42); 
myObj.set('holderPaddingChecked', 'Buster'); 

---

thực hiện khác sẽ là một mixin trong đó sử dụng một mảng watchProperties, mà là một danh sách các thuộc tính đó phải được tuân thủ, xem http://jsfiddle.net/pangratz666/bSF3Z/:

Javascript:

App = Em.Application.create(); 

App.Stalker = Ember.Mixin.create({ 
    init: function() { 
    this._super(); 

    var props = this.get('watchProperties'); 
    Ember.assert("watchProperties should be an array", Ember.isArray(props)); 
    props.forEach(function(property) { 
     // invoke <property>Changed when <property> changes ... 
     Ember.addObserver(this, property, this, '%@Changed'.fmt(property)); 
    }, this); 
    }, 

    willDestroy: function() { 
    this._super(); 

    this.get('watchProperties').forEach(function(property) { 
     Ember.removeObserver(this, property, this, '%@Changed'.fmt(property)); 
    }, this); 
    } 
}); 

var o = Ember.Object.create(App.Stalker, { 
    // 'a b'.w() == ['a', 'b'] 
    watchProperties: 'a b'.w(), 
    aChanged: function() { 
    console.log("a changed"); 
    } 
}); 

o.set('a', 123);