Toggle Variable for Dialog Box once converted to Component

I have created a dialog box on a page and can use the variable to toggle it on an off. However, once I convert that dialog box to a component so I can use it on other pages, I can no longer find a way to toggle it on and off. When I watch the toggle variable in the debug window I get this long name: (_wwLocalVariable(7dd2f4da-b923-43ff-9c0f-66e5b90028bf-open). I am sure it is something simple I am missing.

Updated: Here is a picture showing that I can reach the Notes-open variable in a workflow if I just place a dialog box on my page. However, once I make it a component to I can reuse the box on other pages I lose access to that variable.

With a lot of the videos being on the old format, it has been hard to find a solution to this problem.

Thanks!

You need to:

  1. Create a workflow inside of the component, that handles this logic, e.g toggling the modal, changing the variable
  2. Enable “Execution from outside”
  3. Invoke it from outside via the Execute Component Action in a workflow

Or you could make the component react to a variable change like this:

  1. Create a property inside of your component
  2. Bind that variable to your modal (instead of your variable)
  3. Bind the property to a variable from outside