RC0-Loading bug: it throws "EXCEPTION: Cannot read property 'remove' of null"

Ionic Framework ionic-v3
1

In RC0, I use Loading Component in a page but it throw a exception:

EXCEPTION: Cannot read property ‘remove’ of null

My code is like this:

  ionViewDidLoad() {
    console.log('Hello LoadingTestPage Page');
    let loading = this.loadingCtrl.create({
      content: "Loading...",
      dismissOnPageChange: true,
      duration: 3000
    });
    loading.present();
    setTimeout(() => {
      loading.dismiss();
    }, 2000);
  }

I want to control the time of when to dismiss the loading, like after a promise finished.

When the page runs first the console shows the exception:

error_handler.js:47 EXCEPTION: Cannot read property ‘remove’ of nullErrorHandler.handleError @ error_handler.js:47next @ application_ref.js:272schedulerFn @ async.js:82SafeSubscriber.__tryOrUnsub @ Subscriber.js:223SafeSubscriber.next @ Subscriber.js:172Subscriber._next @ Subscriber.js:125Subscriber.next @ Subscriber.js:89Subject.next @ Subject.js:55EventEmitter.emit @ async.js:74NgZone.triggerError @ ng_zone.js:278onHandleError @ ng_zone.js:257t.handleError @ polyfills.js:3e.runTask @ polyfills.js:3invoke @ polyfills.js:3
error_handler.js:52 ORIGINAL STACKTRACE:ErrorHandler.handleError @ error_handler.js:52next @ application_ref.js:272schedulerFn @ async.js:82SafeSubscriber.__tryOrUnsub @ Subscriber.js:223SafeSubscriber.next @ Subscriber.js:172Subscriber._next @ Subscriber.js:125Subscriber.next @ Subscriber.js:89Subject.next @ Subject.js:55EventEmitter.emit @ async.js:74NgZone.triggerError @ ng_zone.js:278onHandleError @ ng_zone.js:257t.handleError @ polyfills.js:3e.runTask @ polyfills.js:3invoke @ polyfills.js:3
error_handler.js:53 TypeError: Cannot read property ‘remove’ of null
at Loading.ViewController.dismiss (view-controller.js:50)
at loading-test-page.ts:26
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (ng_zone.js:227)
at t.invokeTask (polyfills.js:3)
at e.runTask (polyfills.js:3)
at invoke (polyfills.js:3)ErrorHandler.handleError @ error_handler.js:53next @ application_ref.js:272schedulerFn @ async.js:82SafeSubscriber.__tryOrUnsub @ Subscriber.js:223SafeSubscriber.next @ Subscriber.js:172Subscriber._next @ Subscriber.js:125Subscriber.next @ Subscriber.js:89Subject.next @ Subject.js:55EventEmitter.emit @ async.js:74NgZone.triggerError @ ng_zone.js:278onHandleError @ ng_zone.js:257t.handleError @ polyfills.js:3e.runTask @ polyfills.js:3invoke @ polyfills.js:3
view-controller.js:50 Uncaught TypeError: Cannot read property ‘remove’ of null

But if the page runs again, it works fine.

I don’t know why it happens. The code is like the sample. So I think maybe it’s a bug.

Please help me. Thanks!

2

I think problem in your html file

3

OK… I found why it happens.

If you want to control the time of when to dismiss, you need to remove the duration property.

It’s my fault. Sorry!

4

No, still gives the error (sometimes) regardless of the duration.