Fynn
Fynn

Reputation: 4873

Ionic modal causes TypeError: Cannot read property ‘__cleanup’ of null

I am playing around with the Ionic Framework and its modal component. However, the modal throws errors every time it is used in combination with ionic tabs:

TypeError: Cannot read property '__cleanup' of null
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:39847:15
    at Scope.$broadcast (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20605:28)
    at Scope.$destroy (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20263:14)
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:36981:20
    at wrappedCallback (http://localhost:8100/lib/ionic/js/ionic.bundle.js:19197:81)
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:19283:26
    at Scope.$eval (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20326:28)
    at Scope.$digest (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20138:31)
    at Scope.$apply (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20430:24)
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:21938:36

This issue has already been discussed in the Ionic forum at http://forum.ionicframework.com/t/typeerror-cannot-read-property---cleanup-of-null/9543 with a working fiddle. However, I was not able to find any fix or workaround for the problem. Is there a known fix for this issue in the latest ionic release?

Upvotes: 1

Views: 1500

Answers (1)

Jeremy Wilken
Jeremy Wilken

Reputation: 6976

I can see the problem happening on beta13, but it does not happen on the nightly build. See this example. https://codepen.io/gnomeontherun/pen/empWMy

I only changed the sources to the nightly builds.

<link href="https://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet">
<script src="https://code.ionicframework.com/nightly/js/ionic.bundle.js"></script>

I didn't dig through the changes, but I was able to isolate the problem to the design of using the $ionicModal service inside of a directive's link function. I moved the modal into the home controller (where I would put it) and it worked fine in beta13 as well (https://codepen.io/gnomeontherun/pen/dPYWda). I don't believe the link function is the right place to use it, because anytime there is a state change the link function executes and would try to destroy/recreate the model. Creating the modal instance should happen in the compile or controller of a directive.

Upvotes: 3

Related Questions