AngularJS UIブートストラップのpopover outsideclickトリガーが、アイテムがng-repeatから削除されたときにポップオーバーを閉じます。

私はAngularJS UI Bootstrapポップオーバーを外部のクリックトリガーとポップオーバーテンプレートで使用しています。私のテンプレートの中には、リピート中のアイテムの1つを削除するオプション付きのng-repeatがあります。これはすべて動作しますが、アイテムが削除されるとすぐに、ポップオーバーが閉じます。つまり、ポップオーバーの外側をクリックしたと考えられているようです。ここで実証するplunkさ：http://plnkr.co/edit/vAk3y779eEmLSmIg9kb4?p=preview AngularJS UIブートストラップのpopover outsideclickトリガーが、アイテムがng-repeatから削除されたときにポップオーバーを閉じます。

JS：

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']); 
angular.module('ui.bootstrap.demo').controller('PopoverDemoCtrl', function ($scope, $sce) { 
    $scope.dynamicPopover = { 
    templateUrl: 'myPopoverTemplate.html', 
    }; 


    $scope.checklistitems = [ 
    {check: false, text: "item 1"}, 
    {check: false, text: "item 2"}, 
    {check: false, text: "item 3"} 
    ]; 

    $scope.delete = function (item) { 
    var index; 
    index = $scope.checklistitems.indexOf(item); 

    $scope.checklistitems.splice(index, 1); 
    console.log("yo delete: " + item.text) 
    } 

});

は、HTML：

<html ng-app="ui.bootstrap.demo"> 
    <head> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script> 
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.2.5.js"></script> 
    <script src="example.js"></script> 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 

<div ng-controller="PopoverDemoCtrl"> 


    <span>some text to pad</span> 

    <button uib-popover-template="dynamicPopover.templateUrl" 
    type="button" class="btn btn-default" 
    popover-placement="bottom" 
    popover-trigger="outsideClick" 
    >Popover With Template</button> 

    <script type="text/ng-template" id="myPopoverTemplate.html"> 
     <div ng-repeat="item in checklistitems"> 
      {{item.text}} 
      <button ng-click="delete(item)">delete</button> 
     </div> 
    </script> 

</div> 
    </body> 
</html>

出典

2016-03-22 mahi-man

私は同じ問題を抱えていた、私はちょうどそれがポップオーバーの変更でHTMLをするときの問題ですがわかった - 私は 'NG-show'に私の' NG-if'sを変更あなたの解決策は、削除されたアイテムをタグ付けして非表示にすることができ、ポップオーバーが終了すると実際の「削除」を行うことができます。参照してください：http://plnkr.co/edit/2NifZtWtUuqh8CCBTALf?p=preview –

ありがとう@ベッティーSt、それは私が行く解決策です。あなたが答えとして追加するなら、私はそれを受け入れます。 –