Angular 에서 View 와 Component 에서 발생한 데이터의 변경 사항을 자동으로 일치시키는 기능을 제공하는데, 이를 Data Binding (데이터 바인딩) 이라고 한다.
그리고 Angular 의 데이터바인딩 방법에는 크게 두 종류가 있는데 다음과 같다.
1. Two-Way Data Binding : 양방향 바인딩. Component와 View의 상태 정보를 자동으로 일치시켜 주는 기능
2. One-Way Data Binding : 단방향 바인딩. Component에서 View쪽으로 혹은 View에서 Component쪽으로 한 방향으로 데이터를 바인딩
특히 자주 사용하는 단방향 바인딩 방식 중 Interpolation 은 Component에서 선언한 속성을 View에서 사용할때 쓰인다.
형태는 다음과 같다.
ex. {{value}}
이때 One time binding 하는 방법이 있는데, 일단 그냥 바인딩 하게 되면 scope 변수의 변화에 따라 View에 출력되는 값이 계속 바뀌는데 이럴 경우 변수를 watch 하고 기 때문에 바인딩된 변수가 많을 수록 메모리를 더 많이 사용하게 된다.
따라서 One time binding 하게 되면 초기에 설정한 scope 변수 값만 뷰에 출력 되고 이후 그 변수의 값이 변경 되더라도 View에 업데이트하지 않기 때문에 메모리를 절약할 수 있다.
One time binding 형태는 다음과 같다.
ex. {{::value}}
참고 사이트
- https://moon9342.github.io/angular-lecture-databinding
- http://blog.jeonghwan.net/2016/08/20/angular-facts-easy-to-miss.html
