ионные 4 угловых PWA индивидуальные URL - PullRequest
Новая
       33

ионные 4 угловых PWA индивидуальные URL

0 голосов
/ 13 октября 2019

Я занимаюсь разработкой веб-приложения с Ionic 4 & angular 7. при посещении моего домена оно автоматически перенаправляется на дом. Я хотел бы использовать переменную вместо home

например 

www.mydomain.com/home/school1 to
www.mydomain.com/school1
www.mydomain.com/school2 etc

Пока у меня есть это в моем коде, который работает 

    const routes: Routes = [
      {
        path: '',
        redirectTo: 'home',
        pathMatch: 'full'
      },
      {
        path: 'home',
        loadChildren: './home/home.module#HomePageModule',
        canActivate: [BeforeLoginService]
      },
      {
         path: 'home/:school_name',
         loadChildren: './home/home.module#HomePageModule',
         canActivate: [BeforeLoginService]
       }, 
{ 
path: 'school-dashboard', 
loadChildren: './schools/school-dashboard/school-dashboard.module#SchoolDashboardPageModule' },
  { 
path: 'admin-dashboard', 
loadChildren: './admin/admin-dashboard/admin-dashboard.module#AdminDashboardPageModule' },]

Пока я пыталсякод ниже. Это мешает с маршрутизацией. router.navigateByUrl или router.navigate не работает, когда я реализую этот код 

const routes: Routes = [
      {
        path: '',
        redirectTo: 'home',
        pathMatch: 'full'
      },
      {
         path: ':school_name',
         loadChildren: './home/home.module#HomePageModule',
         canActivate: [BeforeLoginService]
       },{ 
path: 'school-dashboard', 
loadChildren: './schools/school-dashboard/school-dashboard.module#SchoolDashboardPageModule' },
  { 
path: 'admin-dashboard', 
loadChildren: './admin/admin-dashboard/admin-dashboard.module#AdminDashboardPageModule' }
      ]

Есть ли способ выполнить настраиваемый URL-адрес в угловом формате, как показано ниже 

www.mydomain.com/school1 or www.mydomain.com/school2 instead of www.mydomain.com/home/school1

Очень признателен за любую помощь

1 Ответ

1 голос
/ 14 октября 2019

Вы можете попробовать это: 

const routes: Routes = [
{
  path: '',
  loadChildren: './home/home.module#HomePageModule',
  canActivate: [BeforeLoginService]
},
{
 path: ':school_name',
 loadChildren: './home/home.module#HomePageModule',
 canActivate: [BeforeLoginService]
}]

Пожалуйста, проверьте рабочую демонстрацию здесь .

Обновление

Пожалуйста, попробуйте эти маршруты: 

const routes: Routes = [
  {
    path: '',
    loadChildren: './home/home.module#HomePageModule',
    canActivate: [BeforeLoginService]
  },
  {
     path: ':school_name',
     loadChildren: './home/home.module#HomePageModule',
     canActivate: [BeforeLoginService]
  },
  { 
     path: 'school-dashboard', 
     loadChildren: './schools/school-dashboard/school-dashboard.module#SchoolDashboardPageModule' 
  },
  { 
     path: 'admin-dashboard', 
     loadChildren: './admin/admin-dashboard/admin-dashboard.module#AdminDashboardPageModule'
  }
 ];

Таким образом, когда пользователь вводит mydomain.com/school1, приложение покажет HomeComponent, который является страницей входа. Оттуда вы можете взять school1 в качестве параметра, используя: 

this.activatedRoute.snapshot.paramMap.get('school_name')

С помощью этого параметра вы будете знать, в какую школу поступил, чтобы вы могли показать соответствующую информацию и затем аутентифицировать пользователя. После этого вам придется перемещаться, используя: 

this.router.navigate(['/school-dashboard']);

Обратите внимание, что вам нужно будет обработать, если пользователь не ввел название школы в URL, поэтому параметр будет undefined. Вам нужно показать что-то по умолчанию или показать другую страницу вместо HomeComponent. Вы можете сделать это, изменив первый маршрут, чтобы указать на другой компонент: 

{
  path: '',
  loadChildren: './MY_OTHER_COMPONENT_MODULE_PATH#MY_OTHER_COMPONENT_MODULE'
}
...