有没有办法手动删除页面，然后导航到它并使用ionic2再次重新初始化它

Question

        For example i am displaying a home page after login.
        In the Home screen i have a menu in that menu i have options as  New Flight,Home.
        When i click on the home button i will load Home Screen only.
        For that i am using navctrl.push(HomePage). Every time user clicks that button
        it is adding the same page multiple time into the navigation stack.
        can you please tell me how to solve this problem.whenever user clicks the Home Button it want to remove the previous home page and newly it want to add the Home page.how can i achieve this?

下面是我的组件.ts文件代码

• 列表项

      import { Component } from '@angular/core';
      import { IonicPage, Nav, NavParams, App, ViewController } from 'ionic-angular';
      import { NewflightPage } from '../newflight/newflight';
      import { RolesactionPage } from '../rolesaction/rolesaction';
      import { EditProfilePage } from '../edit-profile/edit-profile';
      import { ManagePeoplePage } from '../manage-people/manage-people';
      import { HomePage } from '../home/home';
      @IonicPage()
      @Component({
        selector: 'page-main',
        templateUrl: 'main.html',
      })
      export class MainPage {
        constructor(public navCtrl: Nav, public navParams: NavParams, public viewCtrl: ViewController,public appCtrl: App) {
        }
  
        ionViewWillEnter() {
          var lc = document.createElement('script');
          lc.type = 'text/javascript';
          lc.src = 'assets/js/dialog.js';
          var s = document.getElementsByTagName('script')[0];
          s.parentNode.insertBefore(lc, s);
        }
        rolesAction() {
          this.navCtrl.push(RolesactionPage);
        }
        myFlightAction() {
          this.navCtrl.push(MainPage);
        }         
      }
  
  Above is the my component code.
  I am calling myFlightAction()  from main.html like below
   <a (click)="myFlightAction()"><img src="assets/imgs/flight-depart.png" alt="My Flights"> My Flights</a>
  

  请告诉我我错在哪里。当我通过检查它来检查浏览器时，它正在添加新的 z-index 101 ...每次都是这样，当我点击"我的航班"按钮时。您能否告诉我如何在每次加载每个 ionic 页面时单独加载该页面所需的 Java 脚本文件？

Answer 1

问题是你正在推送一个新页面，这样它就会始终有一个新页面，而不会关闭最后一个页面。在这种情况下，您要做的是使用setRoot方法。

myFlightAction() {
  this.navCtrl.setRoot(MainPage);
}

请注意，这将清除导航堆栈并将MainPage设置为第一页。

推送

页面只是将另一个页面放入导航堆栈中，这就是为什么它为您推送的每个页面提供更高值的z-index。顾名思义，setRoot 将导航堆栈的根组件设置为所需的组件。

编辑 - 不从堆栈中删除登录页面。

您需要知道您所在页面的索引是什么，以便将其从堆栈中删除。由于我不知道页面的顺序以及如何相互访问，或者即使顺序可以是动态的，我们将首先获取页面控制器，以便 e 可以获取他的索引，然后推送另一个页面，然后您将删除前一个页面。

myFlightAction() {
  // Get the controller of the active page
  const myActualController = this.navCtrl.getActive();
  // Get the index of the active page
  const pageIndex: number = this.navCtrl.indexOf(myActualController);
  // Push your new page
  this.navCtrl.push(MainPage).then(() => {
    // In the callback of your push method, after successfully pushing your the page, you'll remove this page based on his index.
    this.navCtrl.remove(pageIndex);
  });
}