[angular] template

[angular] template

데이터 통신방향은 단방향, 양방향이 있다.

// 단방향 (component > DOM) {{템플릿 표현식}} {{title}} [속성]="템플릿 표현식" // 단방향 (DOM > component) (이벤트)="템플릿 문장" // 양방향 [(ngModel)]="템플릿 표현식"

객체 반복문

*ngFor="let 변수명 of 객체이름"

todos.component.html

todos라는 요소를 todo라는 변수에 담는다.

todos.component.ts

결과물

글자클릭시 토글 되게 하기

(click)="todo.done = !todo.done"

이렇게 html에 직접적으로 넣어도 되나 컴포넌트의 메서드로 변경한다.

(click)="메서드명(인자)"

메서드명(인자){ 코드... }

todos.component.html

todos.component.ts

글쓰고 클릭하면 목록추가 (양방향데이터)

todos.component.html

ngModel을 쓸수 없어서 에러가난다

can't not vind to 'ngModel' since it isn't a known property of 'input'.

에러남

todo.module.ts ngModule안에 FormModule을 추가해주면 된다.

todo.module.ts

버튼 추가

todos.component.html

함수안에 코드 넣어주기

todos.component.ts

from http://mongzs.tistory.com/26 by ccl(A) rewrite - 2021-02-26 00:00:54