Установка маршрута по умолчанию в Angular: несколько методов

Чтобы установить маршрут по умолчанию в Angular, вы можете использовать один из следующих методов:

Метод 1: использование конфигурации маршрутизатора в AppRoutingModule

  • Откройте файл app-routing.module.tsв своем проекте Angular.
  • Импортируйте необходимые модули: import { NgModule } из '@angular/core';, import { RouterModule, Routes } из '@angular/router';.
  • Определите свои маршруты как массив объектов Routes.
  • Укажите маршрут по умолчанию, добавив пустой маршрут маршрута { path: '', redirectTo: '/default-route', pathMatch: 'full'.
  • Добавьте маршруты в метод RouterModule.forRoot()в массиве imports.
  • Экспортируйте RouterModuleиз модуля.

Пример:

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
const routes: Routes = [
  { path: '', redirectTo: '/default-route', pathMatch: 'full' },
  { path: 'default-route', component: DefaultComponent },
  // Other routes...
];
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Метод 2. Использование свойства redirectTo в определении маршрута

  • Откройте файл компонента, в котором вы определяете свои маршруты (например, app.comComponent.ts).
  • Импортируйте необходимые модули: import { Router } из '@angular/router';.
  • В конструктор компонента внедрите службу Router.
  • Используйте метод router.navigate()для перенаправления на маршрут по умолчанию.

Пример:

import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
  selector: 'app-root',
  template: `
    <!-- App component template -->
  `
})
export class AppComponent {
  constructor(private router: Router) {
    this.router.navigate(['/default-route']);
  }
}