Ionic 4 (угловой)не работает должным образом - PullRequest
0 голосов
/ 27 февраля 2019

Я пытаюсь заставить работать ionic 4 маршрутизацию, это мой домашний компонент:

<ion-header>
  <ion-toolbar color="primary" class="animated fadeIn">
    <ion-buttons slot="start">
      <ion-menu-button color="secondary"></ion-menu-button>
      <ion-back-button>Back</ion-back-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content padding class="animated fadeIn login auth-page">
  <ion-router-outlet main></ion-router-outlet>
</ion-content>

Это html-файл navbars:

<ion-menu-toggle auto-hide="false" *ngFor="let p of driverNavBarComponents">
    <ion-item [routerDirection]="p.direction" [routerLink]="[p.url]" color="primary">
      <ion-icon slot="start" [name]="p.icon"></ion-icon>
      <ion-label>
        {{p.title}}
      </ion-label>
    </ion-item>
</ion-menu-toggle>

, и это внутри драйвера navBarComponentfile:

public driverNavBarComponents = [
    {
      title: 'Home',
      url: '/driver/cabinet',
      icon:'home',
      direction:'root',
    },
    {
      title: 'Profile',
      url: '/driver/cabinet/profile',
      icon:'contact',
      direction:'forward',
    }
  ]; 

При переходе от /driver/cabinet к /driver/cabinet/profile кнопка возврата не отображается.Также, когда я возвращаюсь домой с панели навигации, маршрут изменяется в URL, но я все еще вижу страницу профиля.так что я делаю не так?

Вот так выглядит мой модуль маршрутизатора:

RouterModule.forChild([
      { 
        path: 'driver/cabinet', 
        component: DriverHomeComponent ,
        children:[
          {
            path: 'profile',
            component: DriverProfileComponent
          },
          {
            path: 'tracking',
            component: DriverTrackingComponent
          }
        ]
      }
    ]),

1 Ответ

0 голосов
/ 01 марта 2019

ion-router-outlet не принадлежит ионному содержимому.

Это компонент верхнего уровня, который не должен быть дочерним элементом.

Пожалуйста, ознакомьтесь со стартовыми проектами.

...