Initialize Angular Form Control with Empty Array

Angular에서 폼의 초기값을 넣어줄 때 주의해야할 점이 있다. 폼에서 사용할 FormControlName을 이 곳의 group 에서 넘기는 객체에 미리 선언해야한다. 미리 초기값을 선언한다면 b와 같이, 선언하고 싶지 않다면 a와 같이 선언하면 되는 간단한 API 이다. c는 조금 다르다. 2를 초기값으로 가지며 배열의 유효성 검사가 없다는 뜻이다, c: [2, null]은 c: 2 와 동일하다. 이와 비슷하게, d는 초기값을 2로 […]

Angular + Redux

English Description Added due to increasing acquisition from USA! (26 Jul 2018) Terminology / Preface 옛날 Angular (JavaScript Based): angular.js 요즘 Angular (TypeScript Based): Angular 2년 전 angular.js + Redux로 작업한 적이 있었다. 최근에 Ionic으로 작업하면서 Angular와 Redux를 같이 사용할 기회가 있었고 적당히 컨벤션을 정리해본다. 이전과 가장 달라진 점이라면 역시 사용하는 프로그래밍 언어다. Action Creator와 […]

내가 경험한 Ionic Framework (2+)

0. 이전에 작성했던 포스트는 angular.js (angular1) 를 기반으로 짜여진 Ionic 1에 관한 내용이었다. 그 뒤로 앱을 개발할 일이 전혀 없을 줄 알았는데, 최근에 백엔드 서버, 프론트 어드민, 그리고 아이오닉 안드로이드를 개발할 일이 다시금 생기면서 Ionic with Angular (a.k.a. angular2+) 에 대해 포스팅 해보려 한다. 1. 역시 Ionic1에서의 컨셉과 비슷하다. TypeScript를 기반으로 하는 Angular를 쓴다는 차이점만이 있을 뿐, 나머지는 전작과 비슷하다. Cordova […]

Angular ngFor with range (not collection)

보통 Angular에서 *ngFor를 돌리는 경우 *ngFor=”let item of itemList”와 같이 어떤 객체들의 리스트를 순회하는데, 그냥 간단히 0부터 어떤 수 n 까지 순회하고 싶은 경우가 있다. 안타깝게도 ngFor 내부의 DSL 에서는 JavaScript의 전역변수들에 접근이 불가능하다. 그래서 해당 템플릿과 연결된 컴포넌트에서 range(i :number) { return Array(i); } 와 같이 함수를 하나 선언한 뒤, *ngFor=”let _trash of range(10); let […]

ng-redux async action with redux-thunk

참고한 문서는 다음 두 개! 공식 홈페이지: AsyncActions 깃허브 공식 예제: ng-redux/examples/async   redux-thunk 의 아이디어는 다음과 같다. lazy-evaluation of action! 즉, 객체를 리턴하는 대신 객체를 리턴하는 함수를 리턴해서 함수가 비동기적으로 작업을 진행하는 도중에 중간중간 객체를 리턴하자는 심플한 아이디어! 그럼 원래 액션객체를 받아먹던 redux reducer가 놀랄(?) 수도 있으니 그 중간에서 redux-thunk가 middleware로 중재해주겠다는 것. 그럼 […]