관리 메뉴

초보 프로그래머의 하루

Typescript로 다른 Router-Outlet의 화면 변경하기 본문

Javascript/Angular

Typescript로 다른 Router-Outlet의 화면 변경하기

nabina 2017.05.23 16:03

가끔 여러 개의 Router-Outlet을 선언해서 사용해야 할 때가 있다. 여러 개를 선언하면 어느 Router-Outlet의 페이지를 변경시킬 것인지 명시를 해줘야 하는데 아래와 같이 사용하면 된다.


선언

<router-outlet name="headerOutlet"></router-outlet>
<router-outlet></router-outlet>
<router-outlet name="footerOutlet"></router-outlet>

<router-outlet>이 이런 식으로 선언되어 있다고 가정했을 때, 아래와 같이 사용하면 된다.


navigate 사용 방법

this.router.navigate( [ `./`, { outlets: { 'headerOutlet': 'header11' } } ] );

아 참고로 header11이 path이다. 그리고 router 객체를 가져오는 건 provider를 이용하면 된다.

0 Comments
댓글쓰기 폼
Prev 1 2 3 4 5 6 7 Next