Wrong ng-click triggered when nested

Asked Jul 03 '15 at 09:22

Active Jul 03 '15 at 09:59

Viewed 380 times

I have a problem with nested ng-clicks which is somehow related to: Two nested click events with angularjs and Nested ng-click's in IE9.

I have the following html structure while the functions use $event.stopPropagation() to not call _outerFunction(). That works fine using the mouse. However, using the keyboard to navigate to either the first element or the 'hover_Button' and pressing 'Enter' will always call the _outerFunction() and not the actual ng-click of the element.

<div class="big_button" ng-click="_outerFunction($event)" title="foo">
    <div class="section">
        <a ng-href="" ng-click="_innerFunction1($event);" title="foo1"></a>
         <div class="hover_Button">
              <a ng-href="" ng-click="_innerFunction2($event);"> <i class="small-button" title="foo2"></i></a>
         </div>
    </div>
</div>

I'm out of guesses why the enter event is passed to the underlying ng-click and not just used by the element that is active.

edited May 23 '17 at 12:06

Community

asked Jul 03 '15 at 09:22

m_hau

Give us a plunker or fiddle to look at and we can help. – Andy Lewis Jul 03 '15 at 09:27
The HTML presented here is wrong - the `` is malformed, a closing `` out of nowhere. – Nikos Paraskevopoulos Jul 03 '15 at 09:52
Sorry, I adjusted the HTML and It should be valid now. – m_hau Jul 03 '15 at 10:00
@m_hau see http://jsfiddle.net/KN9xx/535/ . if you click om inner anchor tags it will fire both inner ng-click and outer one. – Navaneet Jul 03 '15 at 11:53
@Navaneeth yes, but mouse click is not a problem. Its using the keyboard – m_hau Jul 03 '15 at 11:59

Wrong ng-click triggered when nested

0 Answers0