HTML엘리먼트, 디렉티브, 컴포넌트의 프로퍼티의 값을 지정할 수 있다.
예로 버튼의 disabled프로퍼티 값을 설정하여 버튼을 활성/비활성화 할 수 있고 href프로퍼티 값을 설정가능하다.
규정된 템플리문법대로 프로퍼티바인딩을 하면 앵귤러가 클래스 프로퍼티값을 엘리먼트프로퍼티 값에 할당한다.
프로퍼티바인딩된 이후부터는 프레임워크가 변화감지매커니즘으로 단방향데이터흐름으로 뷰를 갱신한다.
이것은 대상 엘리먼트 프로퍼티에 접근할 수 있는 방법을 제공하는 것이 아님을 유의해야 한다. 즉 프로퍼티바인딩했다고 해서 엘리먼트 프로퍼티의 값을 알 수 있는 것이 아니다. 오직 할당만 가능한 것이다.
대상 엘리먼트의 프로퍼티나 메소드에 접근하려면 @ViewChile, @ContentChild를 사용해야 한다.
프로퍼티에 바인딩하기
<img [src]="itemImageUrl">엘리먼트 프로퍼티(DOM 프로퍼티)에 대괄호를 사용하고 우항은 따옴표에 템플릿표현식을 사용할 수 있다.
주의) 대괄호를 사용하지 않으면 템플릿문법이 아니다.
<button [disabled]={{bool}}>ccc</button>문자열바인딩은 태그내에 사용할 수 없기 때문에 따옴표를 사용하여 템플릿표현식을 사용해야 한다. 반대로 태그바같에는 따옴표를 사용하면 리터럴 문자열이 된다.
<p [ngClass]="classes">[ngClass] binding to the classes property making this blue</p>디렉티브 프로퍼티 바인딩
<app-item-detail [childItem]="parentItem"></app-item-detail>컴포넌트 프로퍼티 바인딩
