在 ng-repeat 中将数据传递给 ionic popover答案

【问题标题】：Passing data to ionic popover in ng-repeat在 ng-repeat 中将数据传递给 ionic popover
【发布时间】：2015-09-11 20:18:52
【问题描述】：

我想将 ionic Popover 添加到我的应用程序中并放在 ng-repeat 下，但是我对此有点挣扎。

如何向它传递参数？

<p ng-repeat="query in ctrl.timesheet">query.Name<button ng-click="openPopover($event)">Open Popover</button></p>

<script id="my-popover.html" type="text/ng-template">
  <ion-popover-view>
    <ion-header-bar>
      <h1 class="title">My Popover Title</h1>
    </ion-header-bar>
    <ion-content>
      <button ng-click="ctrl.delete(index)">Delete</button>
    </ion-content>
  </ion-popover-view>
</script>

所以简而言之，我想要一个按钮列表，每当我点击按钮的弹出框时，就有一个删除元素的选项。

【问题讨论】：

标签： angularjs ionic ng-repeat

【解决方案1】：

查看此演示：http://play.ionic.io/app/eb32466d892c
您可以将控制器的范围传递给弹出窗口，因此您在父控制器中拥有的任何内容都可以在弹出窗口中使用。在 openpopover 函数中传递参数索引：ng-click = "openPopover($event, pass-index-here)"> 并在打开弹出窗口之前将其绑定到 $scope.index，请参见：

  $ionicPopover.fromTemplateUrl('my-popover.html', {
        scope: $scope
      }).then(function(popover) {
        $scope.popover = popover;
      });
  $scope.openPopover = function($event,index) {
    $scope.index = {'value' : index}; //i am using object, because simple variable shows binding problem some time
    $scope.popover.show($event);
  };

现在$scope.index 将在弹出窗口中可用，并且将包含您单击的项目的最新索引，因为我们在打开弹出窗口之前更新了它的值：

<button ng-click="ctrl.delete(index.value)">Delete</button>

【讨论】：