Sorry for the ignorance you may not have asked the question correctly, a week ago I started to see a little about Ionic and Angular 2, I came doing some tests and I came across the following problem.
<ion-view title="Teste modais" id="page10" style="background-color:#73F6A6;">
<ion-content padding="true" class="has-header">
</div>
<table style=" border-collapse: collapse; width: 100%;">
<tr>
<td><strong>Nome 1</strong><br/>
<a ng-click="abrirModal()">
<img style=" border-radius: 50%;" src="testeimg.jpg" alt=""><br/>
<a/>
</td>
<td><strong>Nome 2</strong><br/>
<a ng-click="abrirModal()">
<img style=" border-radius: 50%;" src="teste2img.jpg" alt=""><br/>
<a/>
</td>
</tr>
</table>
<script id="teste1.html" type="text/ng-template">
<ion-modal-view>
<ion-header-bar class="bar bar-header bar-positive">
<h1 class="title">Teste 1</h1>
</ion-header-bar>
<ion-content>
<h5 style="color:#000000;">Conteudo 1</h5>
</ion-content>
</ion-modal-view>
</script>
<script id="teste2.html" type="text/ng-template">
<ion-modal-view>
<ion-header-bar class="bar bar-header bar-positive">
<h1 class="title">Teste 2</h1>
</ion-header-bar>
<ionic-content>
<h5 style="color:#000000;">Conteudo 2</h5>
</ionic-content>
</ion-modal-view>
</script>
</ion-content>
</ion-view>This is myModalTest template that I wanted to test and your controller is:
.controller('meuModalTesteCtrl', ['$scope', '$stateParams', '$ionicModal', // The following is the constructor function for this page's controller. See https://docs.angularjs.org/guide/controller
// You can include any angular dependencies as parameters for this function
// TIP: Access Route Parameters for your page via $stateParams.parameterName
function($scope, $stateParams, $ionicModal) {
$scope.abrirModal = function() {
$scope.openModal();
}
///modal inicio
$ionicModal.fromTemplateUrl('teste1.html', {
scope: $scope,
animation: 'slide-in-up'
}).then(function(modal) {
$scope.modal = modal;
});
///é o que mostra
$ionicModal.fromTemplateUrl('teste2.html', {
scope: $scope,
animation: 'slide-in-up'
}).then(function(modal) {
$scope.modal = modal;
});
$scope.openModal = function() {
$scope.modal.show();
};
$scope.closeModal = function() {
$scope.modal.hide();
};
///modal fim
} ])
What I really wanted was to click on the 1st element of the table to open a modal with an X content. And when I clicked on the 2nd element, I would open a modal with Y content, and so on. But in practice always open what you have test2.html [Note: In the controller always appears the modal below all of them]. As I said I'm a beginner so excuse ignorance in still not knowing how to do it in a simple way. Att