Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
Tags
- 옵저버블
- angular button
- Router
- ajax 사용 예시
- TAILWIND
- angular animation
- 아이오닉 스크롤 이벤트
- 스크롤 이벤트
- 앵귤러 애니메이션
- 호버
- 셀렉트박스 커스텀
- Ionic modal
- prisma
- summary
- 모달
- egov spring ajax 사용 예시
- 검색
- scroll
- angular route
- Oracle LISTAGG 사용 예시
- 스크롤 이벤트 감지
- flex-1
- Angular Router
- route
- 앵귤러 모달
- ApexChart
- mysql if
- formgroup
- modal
- angular modal
Archives
- Today
- Total
깜놀하는 해므찌로
Angular navigation routing instanceof 활용 예시 본문
반응형
SMALL
router.events.pipe(filter((ev) => ev instanceof NavigationEnd)).subscribe({
next: () => {
this.layout = route.snapshot.data['layout'];
this.path = router.url;
if (
router.url === '/page' ||
router.url === '/fq' ||
router.url === '/inqu'
) {
this.items = [
{ name: '내 정보', path: '/page' },
{ name: '1:1 문의', path: '/inqu' },
{ name: 'FAQ', path: '/fq' },
];
} else {
this.items = undefined;
}
if (this.section) {
const array = this.path.split('/');
if (array.length > 2 && array[1].includes('asset-manager')) return;
this.section.nativeElement.scrollTo({
top: 0,
behavior: 'smooth',
});
}
},
});
}
`ev instanceof NavigationEnd`는 라우터 이벤트 객체 `ev`가 `NavigationEnd` 클래스의 인스턴스인지 확인하는 조건입니다.
`NavigationEnd` 클래스는 Angular의 라우터 이벤트 중 하나로, 페이지 전환이 완료되었을 때 발생하는 이벤트입니다. `NavigationEnd` 클래스는 `@angular/router` 모듈에서 제공됩니다.
따라서 `ev instanceof NavigationEnd`는 현재 이벤트 객체 `ev`가 `NavigationEnd` 클래스의 인스턴스인지 여부를 확인하는 것을 의미합니다. 이 조건은 오직 `NavigationEnd` 이벤트만 처리하기 위해 사용되며, 다른 라우터 이벤트는 필터링되고 무시됩니다.
즉, 코드에서 `router.events` 스트림에서 발생하는 모든 라우터 이벤트를 구독하고, 그 중에서 `NavigationEnd` 이벤트만 처리하도록 필터링하고 있는 것입니다.
반응형
LIST
'IT' 카테고리의 다른 글
Angular ScrollService 구현 예시 / scroll (0) | 2023.09.01 |
---|---|
Angular nestjs Mysql connect 예시 / external DB connect (0) | 2023.08.31 |
Typescript Angular Row / pageNo / pageNumber / pagination 함수 예시 (0) | 2023.08.29 |
Prisma in / TypeScript Set 중복 제거 예시 (0) | 2023.08.29 |
Prisma Craete Log service search query / 쌓는 방식 로그 (0) | 2023.08.29 |