3

我有一个离子应用程序,它有一个侧面菜单、一个弹出窗口和一个模式。

  • 在一个页面中,有一个网格表。

  • 用户可以选择一行来突出显示它。

  • 然后,用户可以打开弹出窗口并查看或编辑该行。

  • 选择视图或编辑后,将打开一个模式。

  • 在模态中,可以点击右上角的取消按钮来关闭模态。

  • 关闭模式后,应用程序不再读取所有点击、触摸、滑动等。

以下是 和 的popover代码modal

JS

// MODAL
$ionicModal.fromTemplateUrl('templates/modals/view-product.html', {
  scope: $scope,
  animation: 'slide-in-up'
})
.then(function(modal) {
      $scope.viewModal = modal;
  });

  $scope.openModal = function(modal) {
    $scope[modal].show();
  };
  $scope.closeModal = function(modal) {
    $scope[modal].hide();
  };


// POPOVER
  $ionicPopover.fromTemplateUrl('templates/popovers/list.popover.html', {
      scope: $scope,
  }).then(function (popover) {
      $scope.popover = popover;
  });

HTML

<!-- POP OVER -->
<ion-popover-view class="fit">
    <ion-content>
        <div class="list">
            <a class="item" ng-click="viewProduct(this); popover.hide()" ng-bind="lblView"></a>
            <a class="item" ng-click="editProduct(this); popover.hide()" ng-bind="lblEdit"></a>
        </div>
    </ion-content>
</ion-popover-view>

<!-- MODAL -->
<ion-modal-view>
    <ion-header-bar class="bar bar-header bar-positive">
        <h1 class="title">Viewing Product</h1>
        <button class="button button-clear button-primary" ng-click="closeModal('viewModal')">Cancel</button>
    </ion-header-bar>
    <ion-content class="padding">
        <div class="list">
           <!-- list here -->
        </div>
    </ion-content>
</ion-modal-view>
4

5 回答 5

2

在这里我解决了它关闭弹出窗口并在打开模式之前使用超时,看看

    $scope.openModal = function(){
        if(!$scope.modal) return;       

        // Call a function to close the popover
        $scope.closePopover();      

        // Set a timeout to show the modal only in next cycle
        $timeout(function(){
            $scope.modal.show()
        }, 0);
    });
于 2016-11-12T09:26:39.100 回答
1

看来这个问题已经是一个已知的错误,并且已经在离子问题跟踪器中列出:

https://github.com/driftyco/ionic/issues/8582

我想我会等待它在上面的链接中得到回答。

于 2016-11-10T00:38:29.267 回答
0

这应该会有所帮助。

$scope.closePopover = function () {
  $scope.popover.hide();
};

$scope.closeModal = function() {
  $scope.closePopover();
  $scope.Modal.hide();
};
于 2017-03-05T09:22:38.007 回答
0

我在我的 ionic 2 应用程序中遇到了类似的问题。我通过使用“this.navCtrl.pop()”来关闭使用“dismiss()”函数的模式来解决它。

注意:不要在关闭模式后立即使用“this.setRoot()”函数

于 2017-07-11T07:44:33.893 回答
0

刚刚准备了一个小操场示例,也许您可​​以将您的解决方案与它进行比较以确定那里的问题。

http://play.ionic.io/app/89ab5ebbb236

请注意,我在显示模式时主动隐藏了弹出框 - 这可能是问题所在,您是否在应用程序中这样做了?

所以乍一看我无法重现这个问题。如果提供的示例对您没有帮助,那么知道您是否在控制台中遇到任何错误会很有趣。

于 2016-11-08T17:35:38.500 回答