CODEWITHSUNDEEP
javascriptionic-framework
methuselah
methuselah

Reputation: 13206

Passing on data to Ionic modal created by a service

I am using the following solution to create a Ionic Modal service, but at the moment, I am finding it difficult to pass in a into my modal. What can I do to rectify this:

controller.js

$scope.confirmBookingModal = function(val) {
  console.log(val);
  ModalService.show('templates/modals/confirm-booking.html', 'ConsumerBusinessProfileCtrl as vm', val);
}

modal

<ion-modal-view ng-controller="ConsumerBusinessProfileCtrl">

  <ion-header-bar>
    <h1 class="title">Confirm</h1>
    <div class="buttons">
      <button class="button button-clear" ng-click="closeModal()">Close</button>
    </div>
  </ion-header-bar>

  <ion-header-bar class="bar bar-subheader bar-dark modal-padding">
    <h1 class="title">{{ vm.val }} services booked at £110 for 2 hours</h1>
  </ion-header-bar>


  <ion-content>
  </ion-content>

</ion-modal-view>

val outputs a value into the console, so there is some data in there, but I am not sure whether I am accessing it the correct way from the modal.

Upvotes: 0

Views: 133

Answers (2)

methuselah
methuselah

Reputation: 13206

This fixed it:

$scope.confirmBookingModal = function() {
  var vm = $scope;
  ModalService.show('templates/modals/confirm-booking.html', 'ConsumerBusinessProfileCtrl as vm');
}

Upvotes: 0

Aditya Singh
Aditya Singh

Reputation: 16660

Since you are already specifying your controller in your .show() method call, you don't need it in the modal template. Change the modal template as:

<ion-modal-view>

  <ion-header-bar>
    <h1 class="title">Confirm</h1>
    <div class="buttons">
      <button class="button button-clear" ng-click="closeModal()">Close</button>
    </div>
  </ion-header-bar>

  <ion-header-bar class="bar bar-subheader bar-dark modal-padding">
    <h1 class="title">{{ vm.val }} services booked at £110 for 2 hours</h1>
  </ion-header-bar>


   <ion-content>
   </ion-content>

</ion-modal-view>

Upvotes: 1

Related Questions