AngularJS 썸네일형 리스트형 [AngularJS] 데이터 바인딩과 필터 데이터 바인딩은 앞에 controller부분에서 봤었습니다. 다시한번 데이터 바인딩을 살펴보고 필터에 대해 설명 하겠습니다. {{title}} 이름 : {{phone.name}} 설명 : {{phone.snippet}} {{title}}에는 controller에서 $scope.title='PhoneList'라는 값을 설정했으므로 PhoneList가 화면에 출력됩니다. 이 하나의 데이터를 model이라 부릅니다. $scope.phones는 배열에 여러개의 데이터를 담고 있습니다. 이를 collection이라 부릅니다. collection은 ng-repeat속성을 사용해 화면에 반복적으로 출력할 수 있습니다. filter는 ng-repeat에 영향을 주게 됩니다. input태그의 ng-model값과 filt.. 더보기 [AngularJS] contorller 이전에 AngularJS에 대해 간단히 알아보았습니다. 이번에는AngularJS의 컨트롤러에 대해 알아보겠습니다. 앞에서 ng-app, ng-model이라는 걸 봤었습니다. AngularJS의 controller는 ng-controller라는 속성을 부여하면 됩니다. angularjs는 컨트롤러 단위로 바인딩을 합니다. 아래를 보면 {{text}} {{text}} 위 코드를 실행시켜보면 controller1과 controller2가 나오게 됩니다. {{text}}가 두개 들어 있지만 controller가 달라 서로 다른 글자를 보여줍니다. controller 매개변수 $scope는 뷰와 컨트롤러 사이를 연결해 주는 역할을 합니다. $scope를 통해 데이터를 전달합니다. 더보기 [AngularJS] 설정 및 시작하기 AngularJS를 설정하고 시작해 보겠습니다. AngularJS는 구글에서 개발한 라이브러리 입니다. AngularJS는 자동 바인딩을 사용하여 객체의 속성을 바꾸면 화면이 자동으로 변경됩니다. 직접 보면서 해보도록 하겠습니다. 일단 AngularJS홈페이지를 방문하여 소스를 다운받습니다. (http://angularjs.org/) 아래와 같이 입력해 봅시다. {{text}} 아래 input창에 텍스트를 입력해 보면 실시간으로 변경되는걸 보실수 있습니다. {{text}} 여기서 소개는 마치도록 하고 다음부터 Angular.js에 대해 자세히 설명하겠습니다. 더보기 이전 1 다음