離子獲取模態對話框組件自動關閉

我需要幾個非常相似的模式對話框，因此決定將它們分解到組件mycomponent並生成包含它的ionicModal。一切順利，需要時會啓動mycomponent，但我無法弄清楚如何從mycomponent中獲取按鈕以關閉mycomponent模式對話框。離子獲取模態對話框組件自動關閉

什麼是正確的方法來做到這一點？ ionicModal的教程似乎使用全局作用域hide函數，當我添加更多的模態和像這樣的組件時，這將是不好的。

app.component('mycomponent',{ 
    templateUrl: 'js/mycomponent.html', 
    controller: function() { 
      //various stuff 
    }  
}); 

app.controller("mycontroller",function($scope,$ionicModal){ 
    $scope.mymodal = $ionicModal.fromTemplate(
     '<mycomponent options="various stuff"></mycomponent>', { 
    scope: $scope 
    }); 
});

mycomponent.html：

<ion-modal-view> 
    <ion-header-bar class=bar-positive> 
     <button class="button" ng-click="hide()">Done</button> 
    </ion-header-bar> 
    <ion-content> 
      <!-- various stuff --> 
    </ion-content> 
</ion-modal-view>

的index.html

<button class="button" ng-click="mymodal.show()">Edit</button>

來源

2016-11-15 Sideshow Bob

您可以添加一個ID到您的模式，並創建改變布爾函數爲假的功能。然後在你的模態地方ng-show="modals[10]"

<button class="button" ng-click="closeModal(10)">X</button>

腳本：

var modals = []; 

function closeModal(id){ 
    modals[id] = false; 
}

在控制器中添加一個ID參數：

app.controller("mycontroller",function($scope,$ionicModal){ 
    $scope.mymodal = $ionicModal.fromTemplate(
     '<mycomponent options="various stuff" modalId="10"></mycomponent>', { 
      scope: $scope 
     } 
    ); 
});

而且像你讀了從mycomponent.html閱讀選項參數

<ion-modal-view ng-show="modals[id]">

也嘗試Directives。

來源

2016-11-15 12:59:41 driconmax

我對此並不十分清楚。 'ng-show'在哪裏？ 'modals'數組是否包含模態對象？ –

我編輯了答案。試試指令，它對你所需要的東西有用。 – driconmax

我試過了。它適用於顯示和隱藏模式一次，但它不會再顯示。我不確定將'ng-show'設置爲'false'相當於在'ionicModal'上調用'hide（）'嗎？ –

離子獲取模態對話框組件自動關閉

回答

相關問題