Is it possible to use mouseEnter with ember-bootstrap components?

I'm currently using Ember Bootstrap in a project and creating a Navigation Bar has been my first real experience of using contextual components.

The current code for the nav bar is as follows:

<div class="container-fluid" style="padding-left:50px;padding-right:50px;height:50px ">
    <div class="navbar-nav mr-left">
        
        

        
        Dropdown 1 <span class="caret"></span>
        
        Link 1
        Link 2
        
        

        
        Current User: <b>MICKEY MOUSE</b>
        
        
        
    </div>
</div>

Part of the specification for this component is that a sub-menu appears to the left when a user hovers over one of the dropdown links and I'm having a hard time working out how to do it.

The main problem is I can't work out how to take advantage of the mouseEnter event in a contextual component like this. Where I could normally add an action in element space like:

<h1 >Text</h1>

I'm unable to do so here because the element space is controlled by the sub-components. Likewise, If I try and use a closure action like

Then I am unsure how to specify the action fire on the mouseEnter event and get errors of an 'action not found' nature - I suspect because the Ember Bootstrap add on does not expose a anAction action for me to use.

Any guidance would be greatly appreciated.

( I did try to set up a working twiddle for this but was unable to do anything except show an empty navigation bar with no links!)