본문 바로가기

반응형
SMALL

Angular

providers와 viewProviders의 차이 / content child와 view child 안녕하세요. 꼬동입니다. 일을 하다, 모듈 서비스를 Dependency Injection으로 꽂았는데, NullInjectorError가 뜨더라고요 ? 아뿔싸 providers 명시를 안했더라고요 ㅎㅎ 그래서 Service 꽂으려고 하는데 읭 ? viewProviders와 providers 두 방식으로 꽂을 수 있더라고요 엄.. 선택지가 많아지면, 공황이 오는 성격상 둘을 명확하게 알고 가는게 좋을거 같아서 키보드를 잡아봅니다. 사실 간단합니다. viewProviders로 인해 꽂힌 Service를 자식들이 사용하려고 하면, 사용이 안되며, provider로 꽂힌 Service는 자식들이 사용하려하면, 제공해주는 방식입니다. 위의 그림에서도 이를 설명하고 있는데, SimpleService가 Provide.. 더보기
HostListener & HostBinding 안녕하세요. 꼬동입니다. 회사 코드 리팩토링하다가 제대로 알고 있는거 같지않아서, 한 번 글을 써봤습니다. HostListener 와 HostBinding에 관한 글입니다. HostListener HostListener는 DOM event를 선언하여, 이벤트가 발생했을 때 핸들러 메소드가 실행될 수 있게 제공해주는 데코레이터 입니다. Option Description eventName? : string DOM event (ex : 'click') args? : string [] 메소드에 전달할 인수들 @Directive({selector: 'button[counting]'}) class CountClicks { numberOfClicks = 0; @HostListener('click', ['$event... 더보기
attr vs attr.name 개발을 하다가 궁금한게 생겼더랬죠. 이 둘의 차이가 뭘까요. https://stackoverflow.com/questions/60375207/when-use-name-vs-attr-name when use [name] vs [attr.name]? Does anyone know why you can use [id] and you must use [attr.contenteditable] as property binding in Angular? I have researched for some time and I can't find an answer. Why some html native attr... stackoverflow.com 그 대답은 여기서 찾아봤는데요. 설명을 시작해보겠습니다. 그 전에 가정을 해야.. 더보기
Angular 더 빠르게 - On Push 두 번째 이야기 안녕하세요. 지난 글에선 On Push 관련해가지고 얘기를 했더랬죠. https://ggodong.tistory.com/326 Angular 더 빠르게 - On Push CD / Immutability 안녕하세요. 꼬동입니다. 해당 글은 아래의 글을 번역한 글입니다. 약간 제이크 질렌할 닮으셨네여 https://blog.mgechev.com/2017/11/11/faster-angular-applications-onpush-change-detection-immutable-part-1/.. ggodong.tistory.com 이왕 Change Detection 뿌리 뽑죠. https://hackernoon.com/angular-2-4-visualizing-change-detection-default-vs-o.. 더보기
Angular 더 빠르게 - On Push CD / Immutability 안녕하세요. 꼬동입니다. 해당 글은 아래의 글을 번역한 글입니다. 약간 제이크 질렌할 닮으셨네여 https://blog.mgechev.com/2017/11/11/faster-angular-applications-onpush-change-detection-immutable-part-1/ Faster Angular Applications - Part 1. On Push Change Detection and Immutability On AngularConnect 2017 in London, I gave a talk called “Purely Fast.” In the presentation, I showed how step by step we can improve the performance of a busin.. 더보기
constructor과 ngOnInit의 차이는 ? 안녕하세요. 꼬동입니다. 오늘은 constructor과 ngOnInit의 차이를 설명드리려고 합니다. 간단하지만 명확하게 설명을 할 수 있냐라고 제목과 같은 질문을 했을 때 저희는 아마 어버버하게 될 것입니다. ES6 클래스 문법의 표준으로 클래스에서 인스턴스를 생성하는 시점에 호출되는 메서드입니다. constructor가 호출될 땐 앵귤러가 초기화 작업을 수행하기 전이므로 컴포넌트의 속성 가운데 템플릿과 바인딩한 속성이나 부모 컴포넌트로부터 전달받은 속성 등의 초기화를 보장하지 않습니다. @Input으로 넘겨 받은 데이터가 되겠죠. 그렇기 때문에 constructor에는 순수하게 객체의 생성 시점에 필요한 간단한 초기화 로직만 넣도록 합시다. API 호출이나 앵귤러 제공하는 기능은 반드시 ngOnIni.. 더보기
Normalizing State Shape 안녕하세요. 꼬동입니다. 직역을 하자면, State의 형태를 표준화한다. 라는 뜻이 될텐데, 어떤 의미를 가지는지 한 번 같이 보도록 합시다. 해당 글은 Redux 로직과 패턴을 분석하는 글로서, Redux 공홈 Docs를 옮겨 적는 글입니다. https://redux.js.org/usage/structuring-reducers/normalizing-state-shape Normalizing State Shape | Redux Structuring Reducers > Normalizing State Shape: Why and how to store data items for lookup based on ID redux.js.org 대부분의 애플리케이션은 객체에서 depths를 가진 data를 많이 표현하.. 더보기
NGRX - Actions 안녕하세요 ! 꼬동입니다. 그.... 이번에 한 번 진짜 ! 각 잡고 ! NGRX 훑어보기 할려고 합니다. 이번엔 진심 !! 꾸준히 !! 할거야 !! 우선 유튜브 하나만 보고 NGRX는 Redux 패턴의 상태관리 시스템입니다. 상태관리라 함은 앱의 구동에 있어서 필요한 상태를 관리하는거인데요. 저는 그냥 편하게 전역변수를 둔다. 로 생각을 하고 있는데, 전역변수는 위험하잖아여 ? 이걸 안전하게 전역변수로 둬보자로 쉽게쉽게 이해하고 있습니다. 그 중 Actions에 대해서 적어보려합니다. Actions은 NgRx에서 메인이 되는 시스템입니다. 유일한 이벤트를 표한하는 역할을 하고, 유저의 상호작용, 외부 네트워크 요청, 디바이스 API를 통해 Actions이 묘사되거나 사용되죠. 메인이 되는 Actions.. 더보기

반응형
LIST