gọi hành động thành phần ember từ bên trong thành phần

Question

Tôi đang tạo một thành phần để gói hộp chọn select2. Mã bên dưới:

App.FixedSelectComponent = Ember.Component.extend({ 
    actions: { 
    change: function(value) { 
     this.set('selectedValue',value); 
    } 
    }, 

didInsertElement : function(){ 
    this.$("#select1").select2().on("change", function(e) { 
     if ($.isArray(e.val)) { 
      $.each(e.val, function(index,value) { 
       console.log("multiple:",value.split('>')[2].split('<')[0]); 
      // send to change 
      });    
     } else { 
      console.log("single:",e.val.split('>')[2].split('<')[0]); 
      // send to change 
     } 
    }); 
    }, 

    willDestroyElement : function() { 
    this.$("#select1").select2('destroy'); 
}, 

}); 

tuy nhiên, những gì tôi bị kẹt là gửi dữ liệu mà tôi có trong sự kiện ("thay đổi") sang hành động: thay đổi mà tôi đã xác định, hoặc nếu tôi có thể tự đặt thuộc tính đã chọnValue trong sự kiện bật ("thay đổi")

"this" không phải là thành phần tại dòng "// send to change" - làm cách nào/ở đâu để tham chiếu đến thành phần chính nó vào thời điểm này?

cơ bản những gì tôi đang cố gắng để đạt được là để có được các dữ liệu được truyền đến "thay đổi" sự kiện của Select2 vào bất động sản SelectedValue tôi

nhờ

Answer 1

Hãy thử điều này:

App.FixedSelectComponent = Ember.Component.extend({ 
    change: function(value) { 
    this.set('selectedValue',value); 
    } 

    didInsertElement : function(){ 
    var self = this; 
    this.$("#select1").select2().on("change", function(e) { 
     if ($.isArray(e.val)) { 
     $.each(e.val, function(index,value) { 
      console.log("multiple:",value.split('>')[2].split('<')[0]); 
      // send to change 
      self.change(value); // substitute value by whatever you want to pass 
     });    
     } else { 
     console.log("single:",e.val.split('>')[2].split('<')[0]); 
     // send to change 
     self.change(value); // substitute value by whatever you want to pass 
     } 
    }); 
    }, 

    willDestroyElement : function() { 
    this.$("#select1").select2('destroy'); 
    }, 
}); 

Answer 2

this._actions['change'].apply(this, value); 

Answer 3

Bạn có thể sử dụng Component.send('actionName').

Tôi đã tìm thấy số điện thoại trong Ember's documentation.

Answer 4

this.get('actions').change.call(this, value); 

Kiểm tra http://emberjs.com/api/classes/Ember.Component.html#property_actions-'actions' chỉ đơn giản là một tài sản trên phần của bạn.

Answer 5

this bối cảnh sẽ không đề cập đến FixedSelectComponent bối cảnh trong $.each, và cũng có thể sử dụng phương pháp gửi mà sẽ gọi FixedSelectComponent thay đổi phương pháp ..

tham khảo: http://emberjs.com/api/classes/Ember.Component.html#method_send

didInsertElement : function(){ 
    var _this = this; 
    this.$("#select1").select2().on("change", function(e) { 
     if ($.isArray(e.val)) { 
      $.each(e.val, function(index,value) { 
       console.log("multiple:",value.split('>')[2].split('<')[0]); 
      _this.send('change',value.split('>')[2].split('<')[0]); // send to change 
      });    
     } else { 
      console.log("single:",e.val.split('>')[2].split('<')[0]); 
      _this.send('change',e.val.split('>')[2].split('<')[0]); // send to change 
     } 
    }); 
    } 

Answer 6

Ví dụ với thành phần và tài sản tính :

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    callFromComputedProperty: Ember.computed(function() { 
    return this.send('myAction'); 
    }), 

    actions: { 
    myAction() { 
     return 'It Works'; 
    }, 

    callFromAction() { 
     this.send('myAction'); 
    } 
    } 
})