(AngularJS) 모듈

1. 모듈을 이용한 컨트롤러 등록


모듈은 대체로 관련된 기능을 하나로 묶어 다른 코드와 결합도를 줄이고 재사용성을 높이기 위해 사용한다.

다음은 모듈 선언 코드이다.
angular.module("모듈이름", ["사용할 모듈", ....])



ng-app ="ngBookmark"
-> ng-app지시자에는 해당 앱이 사용하는 모듈의 이름을 값으로 줄 수 있다.


.controller("bookmarkListCtrl", ['$scope',function($scope){

이름이 'bookmarkListCtrl'인 컨트롤러 함수를 등록한다. angular.module()함수를 사용하면 그 반환 값으로 module인스턴스가 반환된다. 해당 인스턴스는 controller()함수를 이용해
컨트롤러를 등록할 수 있다.



2. 다른 모듈의 사용 

ng-app에 해당 앱이 사용하는 모듈명을 값으로 주었습니다. 배열로 준 것이 아니라 하나의 값이 들어가므로 하나의 앱에서는 하나의 모듈만 사용할 수 있는 것처럼 보입니다.

재사용되는 코드의 단위를 좀 더 세세하게 쪼개어 여러 모듈로 만들고 싶을 때는 어떻게 할 수 있을까요?

angular.module("ngBookmark", ["moduleA", "moduleB"])

위와 같이 ngBookmark 모듈을 선언할 때 해당 모듈이 참조하는 moduleA와 moduleB를 선언하는 것입니다. 
사실 우리가 사용하는 ng-repeat, ng-select와 같은 지시자와 곧 배울 $http, $log와 같은 서비스 모두 기본 모듈인 ng모듈에서 제공하는 것들이다.



angular.module('cookieDemo', ['ngCookies'])
-> 'cookieDemo'모듈을 선언할 때 ngCookies모듈을 사용한다는 의미로 'ngCookies'문자열을 값으로 가지는 배열을 두 번째 인자로 주었습니다.


- .controller("mainCtrl",['$scope', '$cookieStore', function($scope, $cookieStore)
-> ngCookies모듈은 두 개의 서비스를 제공합니다. 하나는 $cookie이고 다른 하나는 $cookieStore입니다.
$cookieStore 서비스를 사용하기 위해 컨트롤러 함수에 $cookieStore를 인자로 주었습니다.




댓글

이 블로그의 인기 게시물

(ElasticSearch) 결과에서 순서 정렬

(네트워크)폴링방식 vs 롱 폴링방식

(18장) WebSocekt과 STOMP를 사용하여 메시징하기