I have a component that toggles when the window is clicked anywhere.
To achieve that I bind a component method as global event to the body
element.
Moreover, I need to access a component property inside the component method that is called by the click event bound to the body
element.
But it doesn't work:
app/components/example-component.js:
import Ember from 'ember';
export default Ember.Component.extend({
exampleProperty: 'example value',
didInsertElement() {
console.log('start didInsertElement() ************************************************************');
console.log('- "this" is the Ember.js component:');
console.log(this.$());
console.log('- "this.exampleProperty" has the Ember.js component value:');
console.log(this.exampleProperty);
Ember.$('body').click(this.exampleMethod).click();
console.log('end didInsertElement() ************************************************************');
},
exampleMethod(event) {
console.log('start exampleMethod() ************************************************************');
console.log('- "this" is the DOM element that has triggered the event:');
console.log(Ember.$(this));
// console.log(this.$()); This doesn't work
console.log('- "this.exampleProperty" is undefined:');
console.log(this.exampleProperty);
console.log('end exampleMethod() ************************************************************');
},
});
How to get it to work?
Aucun commentaire:
Enregistrer un commentaire