handling back button in ionic for web view

时间:2018-12-03 13:10:13

标签: angular ionic-framework ionic-webview

I tried to handle back button in ionic for web view 

for that, I used navcontoller to navigate in the ionic app

where I am getting an error which I have mentioned below on using navcontrol

 MyApp_Host.ngfactory.js? [sm]:1 ERROR Error: StaticInjectorError(AppModule)[Nav -> NavController]: 
   StaticInjectorError(Platform: core)[Nav -> NavController]:
     NullInjectorError: No provider for NavController!
     at _NullInjector.get (core.js:1003)
     at resolveToken (core.js:1301)
     at tryResolveToken (core.js:1243)
     at StaticInjector.get (core.js:1111)
     at resolveToken (core.js:1301)
     at tryResolveToken (core.js:1243)
     at StaticInjector.get (core.js:1111)
     at resolveNgModuleDep (core.js:10896)
     at NgModuleRef_.get (core.js:12129)
     at resolveDep (core.js:12619)

I am putting the ts code which I added in my site and I am getting the error. I have defined navCtrl in the constructor for navcontoller and used it on window.onpopstate

 window.onpopstate = function(event) {
    //alert('onpop');
    console.log(event);
    console.log('location: ' + document.location + ', state: ' + JSON.stringify(event.state));
    let str = event.target;
    console.log('Hash-----' + document.location.hash)
    let location:Array<String> = document.location.hash.split('/');
    console.log(window.location);
    //let url = document.location.toString();
    //console.log(url);
    //window.location.replace(url);
    console.log(location);
    console.log(location[1]);
    if (location[1] == "createTeam") {
        storage.get('team').then(val => {
            console.log("players-----------------------------")
            console.log(val);
            //console.log(val.length);
            if (val!= null) {
                let alert = alertCtrl.create({
                    title: "ALERT",
                    message: "Do you want to delete this team",
                    buttons: [
                        {
                            text: "Cancel",
                            role: "cancel",
                            handler: () => {
                                console.log("Cancel clicked");
                            }
                        },
                        {
                            text: "Ok",
                            handler: () => {
                                console.log("Ok clicked");
                                storage.remove("team");
                                navCtrl.pop();
                            }
                        }   
                    ]
                });
                alert.present();
            }
            else{
                navCtrl.pop();
            }
        });
    }
    else if(location[1] == "error"){
        alert('back error page');
        navCtrl.pop().then(()=>{
            navCtrl.push('MatchcenterPage');
        })
    } else {
        navCtrl.pop();
    }
    console.log(str);
};

1 个答案:

答案 0 :(得分:0)

您可以订阅导航:

this._app.viewDidEnter.subscribe(x => {
    // your magic here
});

我认为的最佳做法:

  1. 创建一个导航提供程序,因为它将是一个单例并存储状态,不会导致您内存泄漏。
  2. 订阅导航并发挥自己的魔力。