32

ページをプッシュしたいので、コンストラクターに NavController を挿入しています。ただし、以下のコードは Ionic 4 では機能しません。Ionic 3 ではまったく問題ありませんでした。

コンストラクタ

constructor(public menuCtrl: MenuController, public navCtrl: NavController) {
    this.menuCtrl.enable(true);
   }

方法

goToSecondPage()
  {
    this.navCtrl.push(list);
  }

エラー

4

9 に答える 9

52

ここで、最後のステップを完了し、これらのルートをapp-routing.module.tsファイルに実装するには、次のようにします。

const routes: Routes = [
{ path: '', redirectTo: '/home', pathMatch: 'full' },
{ path: 'home', loadChildren: './pages/home/home.module#HomeModule' },
{ path: 'products', loadChildren: './pages/products/products.module#ProductsModule'},
{ path: 'products/:id', loadChildren: './pages/product-detail/product-detail.module#ProductDetailModule' },
{ path: 'products/categories', loadChildren: './pages/product-categories/product-categories.
{ path: 'support', loadChildren: './pages/support/support.module#SupportModule' }
];

HTMLページのsetRoot

<ion-button href="/support" routerDirection="root">

またはクラスで

this.navCtrl.navigateRoot('/support');

押す

<ion-button href="/products/12" routerDirection="forward">

また

this.navCtrl.navigateForward('/products/12');

ポップ

<ion-button href="/products" routerDirection="backward">

また

<ion-back-button defaultHref="/products"></ion-back-button>

プログラムで後方に移動することもできます。

this.navCtrl.navigateBack('/products');

p/s: https://www.joshmorony.com/converting-ionic-3-push-pop-navigation-to-angular-routing-in-ionic-4/

于 2018-10-24T07:33:32.217 に答える
1
this.navCtrl.push(list);

Ionic 4 では機能しません。Ionic 4 は Angular Routing に基づいています。したがって、次のコードを使用して、このためのルートを記述してください。

this.navCtrl.goForward('/list');

NavBar の戻るボタン用

<ion-toolbar> </ion-toolbar>2 ページ目の戻るボタンに次のコードを貼り付けます。

<ion-buttons slot="start">
      <ion-back-button  defaultHref="home"></ion-back-button>
    </ion-buttons>
于 2018-08-13T19:00:39.987 に答える