angularjs ์น์ฑ ๋ชจ๋๊ด๋ฆฌ ํ
๋ชจ๋์ ์ ์ํด์ผ controller, directive๋ฑ์ ๋ง๋ค ์ ์๋๋ฐย ๋ชจ๋ ์ ์์ ๊ตฌํ์ ๊ผญ ํ ํ์ผ์ ํ ํ์๋ ์๋ค.
๋ชจ๋ ์ ์๋ฅผ ๊ด๋ฆฌํ๋ jsํ์ผ์ ๋ง๋ค๋ฉด ๋๋ค.
๋ชจ๋์ ๋ณธ๊ฒฉ ๊ตฌํํ๋ jsํ์ผ์์ ๋ชจ๋ ์ธ์คํด์ค๋ฅผ ์ป์ด์ controller, directive, service๋ฑ์ ์ถ๊ฐํ๋ค.
์ํ์ฝ๋๋ก ์์๋ณด์
- module.js (๋ชจ๋์ ์)
angular.module('moduleA', []);
angular.module('moduleB', ['ngRoute']);
- moduleA.js (๋ชจ๋๊ตฌํ)
angular.module('moduleA').controller('CtrlA', function() {.....});
angular.module('moduleA').directive('directiveA', function() {.....});
์ด๋ฐ ์์ผ๋ก...
๊ทธ๋ฆฌ๊ณ ์ด๋ฐ์ ๋ฐ ๋ ํผ๋ฐ์ค๋ฅผ ๋ดค๋ค๋ฉด ๋ณดํต app.jsํ์ผ์ ๋ง๋ค ๊ฒ์ธ๋ ์ด๋ ๊ฒ dependency injection์ ํ๋ค.
- app.js
angular.module('app', ['moduleA', 'moduleB']);
(๊ทผ๋ฐ ์ด๊ฒ๋ module.js์์ ํด๋ ๋๋๋ฐ...)
๋ง์ง๋ง์ผ๋ก ng-app์ง์
- index.html
<html ng-app="app">ย
์ฃผ์ํ ์ ์ module.jsํ์ผ์ <script>ํ๊ทธ๋ก ๊ฐ์ฅ ๋จผ์ ๋ก๋ฉํด์ผ ํ๋ค
๋!