본문 바로가기

전체 글307

나의 멍청한 짓 web font load google font에서 Inter 폰트를 다운받아 사용하려는데... CSS에서 @font-face에 잘 설정한 것 같은데 안되더라... 구글 폰트는 다운받으면 그 형식은 ttf(true type font)이다. (이것을 woff/woff2로 바꾸어 써도 된다.) 다운 받은 ttf 파일이 잘못된 것인지, 구글에 ttf not loading이라는 키워드로 검색해봤지만 대부분 대소문자/오타의 문제에 대해 다루고 있었다... 내 문제는... @font-face, src 프로퍼티에 local 메서드에 정확한 폰트명을 인자로 전달하지 않았기 때문이다. 여기에 들어갈 정확한 문자열은, 아래 폰트파일을 열어보면 볼 수 있다. (글꼴 이름 부분) 사용하고자하는 폰트는 Inter Black, 나는 지금 까지 Inter로.. 2023. 11. 15.
ActivatedRoute의 snapshot과 Router의 events의 다른 점. ActivatedRouted의 snapshot은 컴포넌트가 생선된 바로 그 순간의 URL정보를 받아온다. 만약 URL이 동적으로 변한다면, Router의 events를 활용해야 한다. events에서는 많은 정보들을 제공한다. 이때 RxJS의 pipe와 filter 연산자로 특정 (프로퍼티/인스턴스)를 찾아내야 한다. 여기서 내가 필요한 것(프로퍼티/인스턴스)은 라우팅이 종료된 시점의 URL이다. 바로 "NavigationEnd" 이다. 아래 코드를 참고하자. 다른 라우터 이벤트 종류 보기 NavigationStart NavigationEnd NavigationStart = 0, NavigationEnd = 1, NavigationCancel = 2, NavigationError = 3, RoutesRe.. 2023. 11. 15.
(내용무) 인스턴스의 이름 가져오기 → instance.constructor.name 2023. 10. 13.
servie.ts 에서 모든 구독자에게 동일한 값을 발행할때 상황: API로 받아온 데이터를 모든 컴포넌트에서 접근할 수 있도록 하는 구조에서router에 의한 페이지 이동 시 router에 의해 렌더링된 컴포넌트 클래스에서 service에서 받아온 데이터를 구독 시 의도하지 않은 다수의 stream 발생. 원인: 컴포넌트가 init 되는 시점에 구독을 한다. A컴포넌트에서 B컴포넌트로, B컴포넌트에서 다시 A컴포넌트로 이동할때 각 컴포넌트는 구독을 n번 하게 되었고 그로 인해 꼭 다수의 stream이 n번 만큼 발생한 것 처럼 보였던 것이었다.이는 구독 후 실행될 로직들이 n번 실행되어 큰 영향을 줄 수 있다. 해결: 컴포넌트가 destroy 될 때 구독을 취소하면 된다. 방법: 크게 두 가지가 있다. stackoverflow에서 퍼옴. #1: 컴포넌트에 Sub.. 2023. 7. 27.
[Angular] 키워드 - form & input validation attributes & states and built-in validators properties form & input validation attribues/states untouched touched pristine dirty invalid valid 값은 true / false built-in validators properties min max required requiredTrue email minLength maxLength pattern nullValidator compose composeAsync 2023. 7. 10.
[Angular] why we should use RxJs of() function? stack overflow에서 "why we should use RxJs of() function?"을 보고 퍼왔다. of()를 사용하는 이유 1. when using fake response. - of에 static한 파라미터를 넣어 observable한 데이터를 반환할 수 있다. 실전에서 HTTP 요청시 get() 또는 post()를 사용하는데 이들은 Observable한 데이터를 반환한다. 때문에 of를 활용한다면 static한 데이터를 Observable로 바꿔서 테스트할 수 있다. 2. of() emits its parameters as single emissions immediately on subscription. - of는 파라미터에 들어있는 단일 데이터를 즉시 제공한다. HTTP 요청 시.. 2023. 7. 4.