본문 바로가기

Web/AngularJs3

[AngularJS 시작-3] JAVASCRIPT FRAMEWORK / Filters 3.8 예제(8) _ Filters 추가 1. uppercase, lowercase 대소문자 변환| 필터 파이프 문자를 사용하여 식에 더해 줄 수 있다. The name is {{ lastName | uppercase }} 2. orderBy 데이터 정렬 Looping with objects: {{ x.name + ', ' + x.country }} Looping with objects:Joe, DenmarkBirgit, DenmarkMargareth, EnglandMary, EnglandJani, NorwayHege, NorwayKai, NorwayCarl, SwedenGustav, Sweden3. filter 특정 문자가 들어간 데이터 추출‘i’ 가 속한 데이터만 추출해준다. {{ x }} 4. te.. 2016. 10. 7.
[AngularJS 시작-2] JAVASCRIPT FRAMEWORK / 비동기통신 $HTTP ajax 통신을 이용해 controller를 호출하여 (비즈니스 로직)데이터를 주고받고, 화면에 그려보는걸 해본다. AngularJs에서는 ajax를 대신해 앵귤러의 내장객체인 $http를 사용하여 백그라운드 데이터 통신을 구현할 수 있다. $http는 jQuery와 상당히 유사한 구조를 가지고 있기에ajax를 많이 사용해본 사람이면 쉽게 이해할 수 있다. 화면단 소스는 다음과 같다.controller는 뷰와 데이터 모델 사이를 연결해주는 작업을 수행해준다.$scope와 $http를 controller에 인젝션하여 사용한다. load item list {{item.ITEM}} {{item.PRICE}} controller에서는 response로 줄 test data를 생성했다.일반적으로 service,d.. 2016. 10. 7.
[AngularJS 시작-1] Javascript Framework/angularJs 예제 1. 정의AngularJS 는 구글에서 개발한 자바스크립트 프레임워크다.AngularJS는 ng-directives를 사용하여 HTML을 확장한다. 왜 사용하는가? 에 대한 좋은 글 >> http://www.codekin.com/?p=1530 2. 사용방법(1) angularjs를 다운받거나, cdn주소를 import 해준다.CDN 주소는 아래와 같다. (2) ng-app 지시자를 통해 AngularJS를 사용하겠다고 정의해준다. --> angular 어플리케이션의 root를 생성하는 것.--> ng-app 지시어는 Anagular를 로드하고 초기화시킨다. -->html 태그에 ng-app 속성을 부여하면, 하위 모든 요소는 모두 Anagular 어플리케이션으로 다뤄진다. (3) ng-model 지시자는.. 2016. 9. 30.