Getting parent controller from within child

I can offer a compelling solution that does not require access to the application object eg. can be called from outside of a Stimulus controller if necessary.

First, modify your controllers so that in the connect() method you add this line:

this.element[this.identifier] = this

This means that each controller - including your “parent” - will expose their internal state via a variable attached to it’s DOM element.

Now, accessing the widget controller of your parent is a query away:

this.element.closest('[data-controller~=widget]').widget

1 Like