Expose useful things from components to outside world?


Often we wrap 3rd party plugins by define component(s), in some cases, plugin use its instance object to access properties or executes methods, something like:

var instance = $(selector).somePlugin(options);



Problem is, these can be done inside the component easily, but we sometimes need to do those things outside the component, like in controller or parent component(s) when they nested, and mostly these requirements don’t relay on events (so I think action is not the ideal option).

My questions are:

  1. How to expose Plugins’ instance object to the outside world?
  2. Is this a good idea at all?


It would probably be better to use a service to wrap the external library and then use the service both in your component and elsewhere as needed. I’ve done that quite successfully in the past


I would say try not to do that.

If there are case where you are responding to an user interaction, you can fire an action and pass along whatever state you need with that action. Have your action handler on the controller handle the passed up arguments.


Do you have a specific example of component? Might be interesting to share thoughts on how to encapsulate properly in Ember, using a real example.