Really need help with a routing issue Uncaught Error

Ionic Framework ionic-v3
1

I hope I ended up posting this in the correct location. I have a problem with an app I am working on. I’m not sure how to explain.

Here is the Issue I am having. I have a home page with a number of buttons to go to different components in my app. here is a steplist that gives me my issue

  1. On home page I click on “Online training”
    o This opens the online.ts component (I hope I’m using the right terms here. Im still new)
  2. On the online page. I have a list of Courses.
    o I click on a button for one of the courses “Enter The Course”
    o This opens a modal window for the course. and does some http calls.
  3. On this course modal is two sections. 1 for the lectures and 1 for the exams.
    o If I click on one of the lecture items, it opens another modal window on top of this one
    o This opens the lecture material in video format.
  4. On The Lecture Material Modal I now close the modal window.
  5. On the course Modal I close the modal window
  6. On the online page I hit the back button to navigate back to the Home Page
    o This is the error I get at this moment.
    ERROR Error: Uncaught (in promise): TypeError: Cannot read property ‘appendChild’ of undefined
    TypeError: Cannot read property ‘appendChild’ of undefined
    at StackController.push…/node_modules/@ionic/angular/dist/fesm5.js.StackController.transition (fesm5.js:3821)
    at fesm5.js:3593
    at StackController. (fesm5.js:3860)
    at step (tslib.es6.js:99)
    at Object.next (tslib.es6.js:80)
    at fulfilled (tslib.es6.js:70)
    at ZoneDelegate.push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391)
    at Zone.push…/node_modules/zone.js/dist/zone.js.Zone.run (zone.js:150)
    at zone.js:889
    at ZoneDelegate.push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
    at resolvePromise (zone.js:831)
    at resolvePromise (zone.js:788)
    at zone.js:892
    at ZoneDelegate.push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
    at Object.onInvokeTask (core.js:17290)
    at ZoneDelegate.push…/node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)
    at Zone.push…/node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)
    at drainMicroTaskQueue (zone.js:601)
    at ZoneTask.push…/node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:502)
    at invokeTask (zone.js:1744)

Now I thought at first it was because I was doing two modals on top of each other but I I got to the exams instead of the lecture in step 3 it opens a modal window also and then when I navigate back it doesn’t give me a problem. But everytime I go to the lectures section and navigate back I get this error. I’ve even tried reprogramming my lextures section in different ways but no matter what I do I get this error.

Does anyone have any ideas.? Thanks in advanced.

Darrell

2

Are you using <ion-back-button>? If yes then try to make a manual button on the online page

3

Hi, thanks for the reply. Yeah actually I did already try this and I even tried other messages to send it to a typescript also using the Navigation Controller. No matter what it still gives me the exact same message. I even changed the Exam and Lectures to Page components instead of modals. What I found there is that once I click on the Lectures page from the online course page that when I try to click back it gives me the error. I think I really messed something up. Right now I’m reprogramming he lectures page from scratch. Sometimes I gotta go back to the beginning. I still don’t know what is causing the problem but maybe I can figure it out while reprogramming it
Thanks Again