Liquid-tether utilization with toooo many actions?!

Hello everyone,

I just installed the Ember addon liquid-tether to use it for modals, popovers and tooltips. According to the documentation, you have to toggle/set a property in the controller to render the target popover into an if block or not. Having like 2 or 3 popovers per controller wouldn’t bother me, but here comes the problem:

I’m showing a list of products while using the each helper. Each product hasMany items which I want to display in a popover of each product row.



There can be for example 30 products = 30 rows = 30 popover properties/actions within the related controller. Did I miss something when reading the docs? Maybe you guys have any suggestions :slight_smile:

Thank you!

That’s an example, you only need one action in either of the approaches below.

You can use any sort of data structure to hang the state of show/hide – such as a weakmap. The key being the model backing each row in your case. In the action you pass the model, look up the hide/show state and toggle it.

GitHub - stefanpenner/ember-state-services helps with the state management here, but really all you need is a weakmap.

Or, have a component backing each row and hang that sort of row state off the row component. The row component also is the thing handling the action.

Many options, figure out which one works for you.

Thanks for your reply!

I’ll have a look at your mentioned possibilities. :slight_smile: