Modal not showing - why?

1

Hi, I’m try to open modal from function and it’s not show. why?

This is my code:

main.controller ('getEvent', function ($scope, $ionicModal, service) {
$scope.selectEvent = function(selectEvent) {
        service.set(selectEvent)
        this.openModal() -----------> Not working!
    };
$scope.openModal = function() {
        $scope.modalCtrl.show();
    }
.
.
.
) };
2

Yeah… it can not work^^.

  1. include $ionicModal
  2. CREATE A MODAL! (e.g. $ionicModal.fromTemplateUrl())
    http://ionicframework.com/docs/api/service/$ionicModal/
  3. store it on a scope variable
  4. [scope.vairable].show(), [scope.vairable].hide()
3

Yeah…I created it.
But, it’s still not working :frowning:

    main.controller ('getEvent', function ($scope, $ionicModal, service) {
    $scope.selectEvent = function(selectEvent) {
            service.set(selectEvent)
            this.openModal() -----------> Not working!
        };
    
        $scope

.openModal = function() {
        $scope.modalCtrl.show();
    };
    
    $ionicModal.fromTemplateUrl('event.html', function(modal) {
        $scope.modalCtrl = modal;
    }, {
        // Use our scope for the scope of the modal to keep it simple
        scope: $scope,
        // The animation we want to use for the modal entrance
        animation: 'slide-in-left'
    });
4

use $scope.openModal() instead of this.openModal()

5

Not working…but, why?!

6

And your modal template is correct “event.html”?

Take a look in your javascript console (in chrome press F12 key on your keyboard or settings -> tools -> javascript console).

Maybe there is an error entry like “blablabla template not found”.

$ionicModal.fromTemplateUrl('event.html', function(modal) {
    $scope.modalCtrl = modal;
    console.log(modal); // debug log in your javascript console, to check if the browser executes this code piece
}, {
    // Use our scope for the scope of the modal to keep it simple
    scope: $scope,
    // The animation we want to use for the modal entrance
    animation: 'slide-in-left'
});