13. $scope -1 ($scope의 계층구조 및 $scope 타입) 1. $scope - $scope 는 양방향 데이터 바인딩의 핵심이자 뷰와 컨트롤러를 이어주는 징검다리이다. 사실 $scope는 그저 단순한 자바스크립트 객체에 불과하다 하지만 이 자바스크립트 객체는 연결된 DOM 요소에서 표현식이 계산되는 실행환경이며 뷰와 컨트롤러에서 사용되는 데이터(data)와 기능(function)이 살아 숨쉬는 공간이다.또한 $scope는 위에서 보듯이 계층적 구조를 가진다. 1) $scope 특징 ① 뷰와 컨트롤러를 이어주는 다리 ② 연결된 DOM에서의 실행환경 ③ 양방향 데이터 바인딩 처리 ④ 이벤트 전파 처리 ⑤ 계층적 구조 2) $scope와 컨트롤러의 관계 ① AngularJS의 컨트롤러는 하나의 컨트롤러에 하나의 $scope만을 가지게 된다. ② 컨트롤러 함수 두 개가.. 더보기 12. MVC - 모델, 뷰, 컨트롤러 1. 개요 - 지금까지 웹 어플리케이션을 개발할 때 제이쿼리와 같은 AJAX라이브러리와 jQuery-UI 같은 UI 컴포넌트만 있으면 된다고 생각했다 하지만 문제는 수많은 콜백(callback) 함수와 UI 컴포넌트 조작 코드가 뒤섞여 실제 어플리케이션의 구조화된 코드는 어디서든 찾아 볼 수 없는 스파게티 코드가 되었다. 근래에 들어 이러한 스파게티처럼 제 역할을 찾지 못하고 꼬인 코드를 풀기 위해 많은 자바스크립트 코드가 쏟아져 나왔다. 특히 아키텍처 패턴인 MVC 패턴을 구현한 수많으 자바스크립트 MVC 프레임워크가 그러하다. AngularJS도 자바스크립트 MVC 프레임워크 중 하나다. 하지만 버전이 올라가며 다양한 기능이 추가됨에 따라 MVVM에 가까게 되었고 사용자들간에 MVVM프레임워크라는 주.. 더보기 11. CSS 클래스/스타일을 동적으로 처리하기 위한 템플릿 ◈ CSS 클래스/스타일을 동적으로 처리하기 위한 템플릿 (클래스 지시자/스탈일 지시자) 1) 클래스 지시자 - 특정 상황에서 CSS 클래스를 동적으로 처리할 때 ng-class 지시자를 이용해 템플릿에서 CSS 클래스를 동적으로 처리한다. ... 또는 ... ① 표현식은 CSS클래스 이름을 스페이스로 구분한 문자열이거나, ② CSS 클래스 이름들로 구성된 배열이거나, ③ CSS 클래스 이름이 속성 이름이고 true/false를 값으로 하는 객체여야한다.(객체일 경우 특정 CSS 클래스 이름의 값이 true일 때에 해당 CSS클래스가 요소에 적용된다.) 2) 스타일 지시자 - CSS 클래스가 적용되어 있지 않고 HTML 요소의 스타일을 동적으로 변경하고 싶을 때 ng-style을 사용한다.... - 표현.. 더보기 이전 1 2 3 4 5 6 7 8 ··· 20 다음
