본문 바로가기

IT

Angular2 강의 메모

angular-cli 설치


$ npm install -g angular-cli


새 프로젝트 만들기


$ ng new first-app


실행하기


$ ng serve


Component 추가


$ ng generate component other  

이렇게 하면 src/app/other 폴더에 파일 생성되고 module에 자동 추가됨


$ ng generate component another --flat --inline-style --inline-template

= ng g             c                  another --flat  -is                  -it


--flat : 폴더 따로 생성 안함

-is : inline style (css 파일 생성 안함)

-it : inline template (html파일 생성 안함)



Databinding




<input type="text" value="{{str}}">
<input type="text" [value]="str">
<p [ngClass]="{redBorder: true}">is this styled..?</p>
<p [ngClass]="{redBorder: isTest()}">is this styled..?</p>
<p [ngStyle]="{color: 'blue'}">is this styled..?</p>

Component Lifecycle


1. ngOnChange

2. ngOnInit

3. ngDoCheck

4. ngAfterContentInit

5. ngAfterContentChecked

6. ngAfterViewInit

7. ngAfterViewChecked

8. ngOnDestory