Можно ли использовать два маршрута в угловых?

Question

Я создаю приложение Angular, используя Angular7, и пытаюсь использовать два тега "router-outlet". Например, у меня есть два компонента "main" и "main2", которые наполовину совпадают, они маршрутизируются в родительском компоненте, и Я хочу направить их различия в два дочерних компонента, возможно ли это? есть ли у вас способ исследовать? Спасибо;)

Answer 1

Для тех, у кого та же проблема, что и у меня, я использую компонент main и компонент auth. "Основной" компонент содержит тег "router-outlet", а мой компонент "auth" - мой вид входа в систему. В моем app.componnt.html я просто использую

<app-auth *ngIf="!isAuth"></app-auth>
<app-main *ngIf="isAuth"></app-main>

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

Answer 2

Хорошо, если я очень хорошо понимаю ваши вопросы. Это очень возможно, например, когда у вас есть логин и панель инструментов, например

const routes: Routes = [
    {
        path: '',
        pathMatch: 'prefix',
        redirectTo: 'auth/login'
    },
    {
        path: 'loading',
        component: LoadingComponent
    },
    {
        path: 'auth/login',
        component: LoginComponent
    },
    {
        path: 'auth/forgot-password',
        component: ForgotPasswordComponent
    },
    {
        path: 'auth/register',
        component: RegisterComponent
    },
    {
        path: 'auth/reset-password-temp',
        component: ResetPasswordComponent
    },
    {
        path: 'dashboard',
        component: AdminComponent,
        canActivate: [AuthGuard],
        children: [
            {
                path: 'welcome',
                component: WelcomeComponent
            },
            {
                path: 'messages',
                canActivate: [AuthGuard],
                component: MessagesComponent
            },
            {
                path: 'student-add',
                component: StudentAddComponent
            },
            {
                path: 'student-edit',
                component: StudentEditComponent
            },
            {
                path: 'student-view',
                component: StudentViewComponent
            }

        ]
    }
];

@NgModule({
    imports: [RouterModule.forRoot(routes, { useHash: true })],
    exports: [RouterModule],
    providers: []
})
export class RoutingModule {}

С каждым импортированным компонентом и правильной ссылкой на путь