Question

我试图在uib-accordion-group上放一个关闭（x）按钮。按钮显示下面的代码，但是当您按下按钮时没有任何反应。

如果我在uib-accordion的身体部位放了一个按钮，它可以工作，但无法放入标题。

非常感谢你的帮助。

<div ng-controller="myController" >

  <script type="text/ng-template" id="group-template.html">
<div class="panel-heading">
  <h4 class="panel-title" style="color:#fa39c3">
    <a href tabindex="0" class="accordion-toggle" ng-click="toggleOpen()" uib-accordion-transclude="heading">
      <span uib-accordion-header ng-class="{'text-muted': isDisabled}">
        {{heading}}
      </span>
    </a>
            <button type="button" class="close" aria-label="Close" ng-                               click="$parent.remove_fruit(name)">
                 <span>&times;</span>
            </button>
  </h4>

</div>
<div class="panel-collapse collapse" uib-collapse="!isOpen">
  <div class="panel-body" style="text-align: right" ng-transclude></div>
</div>

<div ng-repeat="name in names">
  <uib-accordion close-others="oneAtATime">
    <div uib-accordion-group class="panel-default" is-open="status.isCustomHeaderOpen" template-url="group-template.html">
    <uib-accordion-heading>
       {{name}}
     </uib-accordion-heading>
    </div>
 </uib-accordion>
</div>

 var myApp = angular.module('myApp',['ui.bootstrap', 'ngAnimate', 
   'ngTouch']);
  myApp.controller('myController', function myController($scope) {

    $scope.names = ['apple','banana','orange'];
    $scope.remove_fruit = function(name){
      window.alert(name);
        for (var i = 0; i < $scope.names.length; i++) {
           if ($scope.names[i]==name) {
                    $scope.names.splice(i,1);
                    }
       }
}
});

Answer 1

我为你提供了你需要的结果，请检查 https://jsfiddle.net/athulnair/6c5rddt6/

<uib-accordion close-others="oneAtATime">
      <uib-accordion-group ng-repeat="group in names"><uib-accordion-heading>
        {{group}} <a ng-click="removeElement(group)" class="pull-right" stop-event='click' >&times;</a>
      </uib-accordion-heading>
      {{group}}</uib-accordion-group>
</uib-accordion>

你可以看到uib-accordion-heading，你可以把你的关闭按钮放在哪里

还添加了删除对象，同时单击关闭按钮

如何在uib-accordion-group标题上放置一个关闭（X）按钮？

1 个答案: