jlommori
jlommori

Reputation: 171

Ember.js Component didRender Variable Scope

I am using an Ember Component's didRender() hook to implement some javascript that needs to run after the DOM is loaded. For Example:

didRender() {
  var signaturePad = new SignaturePad($("#sigElement"));
  signaturePad.clear();
}

This is working fine. However, I need to access the signaturePad variable from my actions in the same component to have buttons function appropriately. Such as:

actions: {
   clearSignature: function() {
     signaturePad.clear();
   }
}

Unfortunately, it seems my variable defined in the didRender() hook for the component does not pass to the actions.

How am I able to access this variable from my actions within the same component?

Upvotes: 0

Views: 149

Answers (1)

Ebrahim Pasbani
Ebrahim Pasbani

Reputation: 9406

If you want to do a something just after loading DOM, you should use didInsertElement hook.

And creating a variable does not set that as propert to use after in another situation.

Please change like this :

didInsertElement() {
  var signaturePad = new SignaturePad($("#sigElement"));
  signaturePad.clear();
  this.set('signaturePad', signaturePad);
}

actions: {
   clearSignature: function() {
     this.get('signaturePad').clear();
   }
}

Upvotes: 2

Related Questions