Page 18 -

티가 필요한 기능입니다.

● a, b 변수가 변경될 때 돔에 반영하기

● input 값이 변경될 때 변수 a, b의 값을 업데이트하기

참고

양방향 바인딩(two-way binding)
위와 같은 형태를 양방향 바인딩이라고도 합니다. 뷰의 데이터(input, option, select의 value
등)를 모델(자바스크립트의 데이터)에, 모델의 데이터를 뷰에, 양방향으로 실시간으로 반영(바인

딩)하는 개념입니다.

스벨트에서 모델의 데이터가 존재하는 곳이 스크립트 블록입니다.

그림 1-2 데이터를 뷰로 바인딩

변경 자동 반영
스크립트 블록 HTML 블록
(데이터) (뷰)

스크립트 블록의 모델, 즉 데이터가 변경되면 뷰에 실시간으로 자동으로 반영됩니다.

스벨트에서 뷰에 해당하는 곳이 HTML 블록입니다.

그림 1-3 뷰의 변화를 데이터로 바인딩

자동 반영 변경
스크립트 블록 HTML 블록
(데이터) (뷰)

020