Sense categoria

Angular Routing

Angular, Routing

Angular Routing

anchor tag 사용

일반적으로 Anchor tag(#) 를 이용해서 웹 페이지 내부 특정 위치로 이동을 정의 한다.

1
<a name="about"><h2>About<h2></a>

이렇게 할 경우, http://server/#about 하게되면 해당 <h2> tag로 이동하게 된다.

SPA(Single Page Application) 에서는 http://server/#/about과 같이 사용하며, 이를 hash-based rounting이라 한다.

HTML5 Client-side Routing

HTML5에서 브라우저가 신규 요청없이 URL을 바꿀 수 있게 되었다.
history.pushState javascript method를 통해서 navigation history 를 접근할 수 있다.

HTML5 mode Routing

  1. older browser 는 지원하지 않음
  2. server에서 HTML5 base routing을 지원해야 함

Angular 에서의 Routing

Component와 path가 mapping 되도록 개발함

사용법

1
import { RouterModule, Routes } from '@angular/router';
Compartir