Reading your question made me think that it is possible to restore the template settings without the need for this complex code in the templates and fix the main reason - the inability to understand which image is currently visible, and it is easy to set the next to be visible.
I found that it is best to forget about trying to access the parent content of data from child templates, because ReactiveVar in any case inaccessible through data contexts (as you have no doubt learned). And data context hierarchies are dependent on Blaze html, so it is not recommended to use them that way.
And other extremes have a Session variable that would be very global.
Fortunately, there is a middle way.
Define ReactiveVar outside the template namespace, and then it will be equally accessible to both parent and child templates. This works especially well if you are trying to write a package and do not want to pollute the global session namespace.
For example, put this in hello.html:
<head> <title>rangetest</title> </head> <body> <h1>Welcome to RangeTest!</h1> {{> hello}} {{> rangeList}} </body> <template name="hello"> <p>And another test {{anotherTest}}</p> </template> <template name="rangeList"> {{#each ranges}} {{> range}} {{/each}} </template> <template name="range"> <p>{{name}}</p> <input type="range" value="{{value}}" min="1" max="10"> </template>
and this is in hello.js
if (Meteor.isClient) { anotherDict = new ReactiveDict('another'); anotherDict.set('hey',2); Template.hello.helpers({ anotherTest: function() { return anotherDict.get('hey'); } }); Template.rangeList.helpers({ ranges: function() { var ranges = [ { 'name':'first', 'value': 5 }, { 'name':'second', 'value': 6 }, { 'name':'third', 'value': 7 }, { 'name':'fourth', 'value': 8 } ]; return ranges; }, }); Template.range.events({ 'input input[type="range"]': function(e,t) { var value = parseInt(e.target.value); anotherDict.set('hey',value); } }); }
You will see that reactive variables spread well between patterns.
This probably does not answer your question about event listeners, but I hope you can replace the event listener with the addition of manually using the event listeners Template.Image.events({ after implementing reactivity, as I suggested, those will be closely related to the specific a template for children, and there will be no way for them to be unpredictable.
ps I had an example of using ReactiveDict and range input values, since that was the question where I needed to solve a similar problem. I had all three research options, and this was what finally worked and felt in a more or less meteor way.