javascript - ng-click in parent div also in child div

I've the following code:

        <table class="table">
            <tr>
                <th>Name___</th>
            </tr>
            <tr ng-repeat="app in apps"
                ng-click="go('/editApp/' + plugin.name);">

                <td>
                    <span>{{app.name}}</span>
                </td>
                <td style="width: 100px;">
                    <i class="glyphicon glyphicon-pencil" 
                              ng-click="openPopup(app)"></i>
                </td>
            </tr>
        </table>

When I click on the OpenPopup, also the go() method firing, how can I do that, If I click on popup just the popup will fire?

I've the following code:

        <table class="table">
            <tr>
                <th>Name___</th>
            </tr>
            <tr ng-repeat="app in apps"
                ng-click="go('/editApp/' + plugin.name);">

                <td>
                    <span>{{app.name}}</span>
                </td>
                <td style="width: 100px;">
                    <i class="glyphicon glyphicon-pencil" 
                              ng-click="openPopup(app)"></i>
                </td>
            </tr>
        </table>

When I click on the OpenPopup, also the go() method firing, how can I do that, If I click on popup just the popup will fire?

Share Improve this question edited Mar 4, 2014 at 17:17 GraphicsMuncher 4,6414 gold badges37 silver badges50 bronze badges asked Mar 4, 2014 at 11:22 Ramzy Abourafeh 1,1957 gold badges18 silver badges35 bronze badges

2 remove the ng-click from tr – Lekhnath Commented Mar 4, 2014 at 11:25
Well, if you click a child element you've actually clicked its parent too. This is called event propagation, in particular event bubbling – Kevin Cittadini Commented Mar 4, 2014 at 11:30

Add a comment |

1 Answer 1

Sorted by: Reset to default 32

This executing because your <td> nested in <tr>, and click firstly fired openPopup()

then fired go(). You can use $event.stopPropagation() for stop event propagation to <tr>. Try

        <table class="table">
        <tr>
            <th>Name___</th>
        </tr>
        <tr ng-repeat="app in apps"
            ng-click="go('/editApp/' + plugin.name);">

            <td>
                <span>{{app.name}}</span>
            </td>
            <td style="width: 100px;">
                <i class="glyphicon glyphicon-pencil" 
                          ng-click="openPopup(app);$event.stopPropagation()"></i>
            </td>
        </tr>
    </table>

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - ng-click in parent div also in child div - Stack Overflow

1 Answer 1

与本文相关的文章

评论列表(0)