Как правильно реализовать названную розетку роутера в angular 7? - PullRequest
Новая
       25

Как правильно реализовать названную розетку роутера в angular 7?

0 голосов
/ 27 января 2019

Я застрял с проблемой в моем коде.Я пытаюсь сделать именованный маршрут работающим, но я не могу понять, что я делаю неправильно.

Я попробовал туториал на официальном и других сайтах.Мне нужно иметь навигационную панель (на данный момент смоделированную через app-menu) и рядом с ней названный выход для маршрутизатора.Когда пользователь нажимает на панель навигации, я хочу отобразить компоненты рядом с ней.Мой основной маршрутизатор уже используется для чего-то другого

menu.component.html 

<a [routerLink]="[{ outlets: { main: ['users'] } }]">Users</a>

home.component.html (описать селектор меню приложения) 

<app-menu></app-menu>
<router-outlet name='main'></router-outlet>

app-routing.module.ts 

const routes: Routes = [
{ path: 'login', component: LoginComponent },
{ path: 'home', component: HomeComponent, canActivate: [AuthGuardService] 
},
{ path: 'users', component: UsersComponent, outlet: 'main', canActivate: [AuthGuardService] 
},
{ path: '', redirectTo: '/home', pathMatch: 'full' },
];

Когда я нажимаю ссылку «Пользователи», я получаю следующую ошибку:

Ошибка: невозможно сопоставить ни один маршрут.Сегмент URL: «дом».

Не могли бы вы мне помочь?Я новичок в угловой!

1 Ответ

0 голосов
/ 09 мая 2019 
 <a [routerLink]="[{ outlets: { main: ['users'] } }]">
    users
</a>

///////////////// или 

<button (click)="Users()" > users</button>

// in the component
  import { Router } from '@angular/router';

  constructor(private router: Router) {
  }
  users() {

   this.router.navigate([{ outlets: { main: ['users'] } }]);
  }
...