Can please anyone help to figure out why I am having this error. If i try to close to modal it give me an error. “Navigation stack needs at least one root page”
import { Component, OnInit } from '@angular/core';
import { ModalController, NavController } from 'ionic-angular';
import {AddPage } from '../add/add';
import {CarsService} from '../../providers/cars-service';
import {AuthService} from '../../providers/auth-service';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage implements OnInit {
reports:string[];
constructor(private carService: CarsService,private auth: AuthService, public navCtrl: NavController,
public modalCtrl: ModalController) {
}
ngOnInit() {
this.carService.loadCars().subscribe(data=>{
// console.log(vehicule);
this.reports = data;
console.log(this.reports);
})
}
addCar(){
let modal = this.modalCtrl.create(AddPage);
modal.onDidDismiss(car => {
if(car){
this.reports.push(car);
this.carService.addReport(car).subscribe(report => {this.reports= report;console.log(this.reports)},
(err)=>{ console.log(err)}
);
}
});
modal.present();
}
}
tab page
import { Component } from '@angular/core';
import {ViewController} from 'ionic-angular';
import { HomePage } from '../home/home';
import { ChercherPage } from '../chercher/chercher';
import { ContactPage } from '../contact/contact';
import { AddPage } from '../add/add';
@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {
// this tells the tabs component which Pages
// should be each tab's root Page
tab1Root: any = HomePage;
tab2Root: any = ChercherPage;
tab3Root: any = ContactPage;
tab4Root: any = AddPage;
constructor(public viewCtrl: ViewController) {
}
}
if i launch the modal it come but if i try to close it I get an error saying that navigation stack needs at least one root page
This is an open source community, I can give you multiple reasons why this post wasn’t answered. Are you experiencing this same issue? Or do you actually want to do a real contribution to this topic? Keep in mind that everyone over here is doing this as a volunteer, sometimes you might not found the answers you want or expect.
@amad4biz did you figure it out or do you still need some help?
Yeah, I’m frustrated. It’s frustrating when you can’t fix a problem and not even google will help. Yes, I have the same problem. The only thing that fixed it was commenting this.navCtrl.pop();
The runtime error says it might’ve been called too many times, but it’s only called once.
This is the thing I’m having issues with. When I’m loggin in, it throws a runtime error which is the title of this topic. I don’t know what the current state of the nav stack is. I only know that trying to log in with multiple instances(firebase + facebook/twitter) throws the same runtime error even if I have the .pop method commented. I’m bad at this.
Also somehow I managed to fuck up local storage. No logins save to local storage anymore. It did until a few hours ago and I’ve no idea what I’ve done wrong.
Okay I’m missing some context here. Where are you calling this loginmethod? Is it by any chance inside the modal? Because if it is, you shouldn’t use navCtrl.pop() method to close the modal. I think your question actually differs from the OP, but maybe you could provide us the steps you are taking.
Couple of questions:
Do your tabs work without opening up a modal?
Do you have an active tab when opening up the modal?
From which component are you opening the modal?
Which page is open when opening up the modal?
Where are you calling the loginmethod (which component)?
Maybe it would be better if you were able to create a small repository for us with the correct context.
BTW I would use ionic-storage if I were you. More persistent and it’s a lot easier to catch errors or problems when reading/writing to localstorage etc
I’m getting this same issue on ionic 3/angular 4. It happens when I refresh a stacked view and then try to pop back. All my pages are “deep linked” where I’ve provided a name in the IonicPage metadata i.e.
@IonicPage({
name: 'home'
})
So in the browser, the url is http://localhost:8100/#/home. After I refresh the page and then try to pop, I get ERROR Error: Uncaught (in promise): navigation stack needs at least one root page
These are the important versions in my package.json
Your comment says more about you than it does about Ionic.
I was in the process of upgrading Ionic to the latest version and was stuck on this problem for many hours.
I dug through my code for many hours, thinking that the problem was with Ionic. It turns out I had code in my app.component.ts that called pop(), which caused me to pop when I was already on the root page. For some reason it only started calling errors after upgrading.
From my experience with Ionic, and I have been using it for about a year, they fix things fast and the changes are always good. This community is also usually pretty nice and helpful.
I think you might have a situation where you’re calling dismiss() twice. Only call it in the component of the modal that you’re trying to dismiss, not the page from which you’re opening the modal too.