Angular) 라우터 생성

Angular는 라우터를 지정해줘야지만 해당 경로로 이동할 수 있음

   ex) 127.0.0.1:4200/register 이런 경로

 

App-routing.module.ts 파일 수정

import { NgModule } from "@angular/core";
import { Routes, RouterModule } from "@angular/router"; //RouterModule 읽어오기

import { RegisterComponent } from "./components/register/register.component"; //필요한 컴포넌트 객체 생성

const routes: Routes = [
  { path: "", component: HomeComponent },
  { path: "register", component: RegisterComponent } //routes 변수 생성, 각 루트에 컴포넌트 등록
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule] //RouterModulde 등록
})
export class AppRoutingModule {}

 

App.component.html에 router-outlet 추가해주면 각각의 지정된 경로로 잘 동작함