AngularJs：ng-click 不适用于嵌套的 uib-accordion答案

【问题标题】：AngulaJs: ng-click not work on netsted uib-accordionAngularJs：ng-click 不适用于嵌套的 uib-accordion
【发布时间】：2016-12-20 23:02:31
【问题描述】：

我使用nested uib-accordion，我想将ng-click 添加到每个uib-accordion。

      <uib-accordion close-others="oneAtATime1">
            <div uib-accordion-group class="panel-default" is-open="prInfo.isOpen" heading="{{prInfo.name}}"
                 ng-click="getPayrolls(prInfo)"
                 ng-repeat="prInfo in allPersonInfoNames">
                <uib-accordion close-others="oneAtATime2">
                    <div uib-accordion-group class="panel-default" heading="{{payroll.logPeriod.name}}"
                         ng-click="getPayroll(payroll)"
                         ng-repeat="payroll in prInfo.payrolls | orderBy: 'logPeriod.dbId': reverse = true">
                        <div class="row">
                            <div class="col-md-4">
                                <h1>in nested accordion</h1>
                            </div>
                        </div>
                    </div>
                </uib-accordion>
            </div>
        </uib-accordion>

所以，当我单击第一个手风琴时，第一个 ng-click 正常工作，但是当我单击第二个手风琴时，再次调用第一个 ng-click，而第二个 ng-click 从未调用过。

我可以通过在手风琴体中添加第二个ng-click 来解决这个问题，但是通过这个解决方案，我必须单击 3 次才能工作第二次 ng-click，第一次打开第一个手风琴并首先运行 ng-click，第二次打开第二个手风琴，第三次单击嵌套手风琴体中的功能才能运行第二个ng-click。如何通过第一个解决方案分隔ng-click functions？

demo on plunker

【问题讨论】：

在您的 plunkr 中，此行导致错误。 $scope.allPersonInfoNames[1].payrolls.push({deposit: 999999}) 因为 $scope.allPersonInfoNames[1] 没有关键工资单。
问题已解决，但现在当我点击第二次 ng-click 时，再次调用了两个函数。

标签： angularjs angular-ui-bootstrap accordion angularjs-ng-click

【解决方案1】：

您面临的问题似乎与此线程有关：AngularJS ng-click stopPropagation 当你点击第二次 ng-click 时，你必须停止事件传播以防止第一个方法被触发。

希望对你有帮助

【讨论】：