[AngularJS] (10) 서비스 | location, get, timeout, interval, app.service()

목차

(1) 기본 웹 서비스 개발환경 구축

(2-1) 기본 예제

(2-2) AngularJS 템플릿 만들고 적용하기

(3) 표현식 | {{data}}

(4) 모듈 | angular.module("appName", [])

(5) 지시자 | angular.directive(), ng-app, ng-init, ng-repeat

(6) 모델 | ng-model, ng-show, valid, dirty, touched

(7) Controller

(8) scope 객체 | scope, rootScope

(9) 필터 | uppercase, lowercase, orderBy, currency, date, filter, json, limitTo, number

(10) 서비스 | location, get, timeout, interval, app.service()

 

---

서비스란 AngularJS에서 제공하는 다양한 기능을 말한다.

controller의 2번째 인자인 function의 인자로 사용하고자 하는 서비스 객체를 넣어 사용할 수 있다.

 

1. AngularJS의 서비스 객체 사용해보기

- location : 주소 창의 주소를 관리

- get        : ajax 통신을 통해 다른 파일의 응답 결과를 가져옴

- timeout : JavaScript의 timeout

- interval  : JavaScript의 interval

....

 

> $scope 객체 : controller내부에 선언한 데이터를 scope에 저장해 tag내에서 사용할 수 있는 기능을 담당

 

 

> $location 객체 : 주소창에 있는 주소를 관리하는 객체

   *JavaScript의 location.href와 유사

주소창의 주소를 가져온다

> $location.absUrl과 location.href 모두 주소값을 가져올 수 있지만, location.href만이 특정 주소로 이동할 수 있다.

 

 

> $http 객체 : Ajax 통신을 이용해 원하는 페이지를 요청

   * Ajax를 통해 페이지 변환 없이 요청에 대한 응답결과를 변수에 담을 수 있다.

 

 

> $timeout 객체 : 지정된 시간 후에 지정된 함수를 호출

 

 

> $interval 객체 : 지정된 시간만큼 지정된 함수를 반복 호출

 

 

2. 서비스 객체 만들어서 사용해보기

> app.service(서비스명, 함수)로 사용자 정의 서비스를 만들어 사용할 수 있다.

   생성한 사용자 정의 서비스는 AngularJS 서비스와 마찬가지로 Controller function의 인자에 선언해준 뒤 사용할 수 있다.