블로그 이미지
윤영식
Full Stacker, Application Architecter, KnowHow Dispenser and Bike Rider

Publication

06-25 03:49

Category

Recent Comment

2013. 4. 10. 16:52 AngularJS/Concept

앵귤러의 시작 스텝에 대해서 알아보자 



1) 자동 초기화

  - <tag ng-app="name">

    + Angular는 DOMContentLoaded  이벤트가 발생하면 자동 초기화를 수행한다 

    + 이때 Angular는 애플리케이션 root를 만들어주는 ng-app 지시자(Directive)를 찾는다

    + Angular는 Directive 와 관련한 Module을 로드한다

    + 애플리케이션 injector 를 생성한다 

    + ng-app 지시자를 root로 해서 DOM을 Angular appliction으로 컴파일 해준다

  1. <!doctype html>
  2. <html ng-app="optionalModuleName">
  3. <body>
  4. I can add: {{ 1+2 }}.
  5. <script src="angular.js"></script>
  6. </body>
  7. </html>



2) 수동 초기화

  - ng-app을 사용하지 않는다

  - 모든 문서와 소스가 로딩된후 angular.bootstrap(RootDocument)를 컴파일 한다 

  1. <!doctype html>
  2. <html xmlns:ng="http://angularjs.org">
  3. <body>
  4. Hello {{'World'}}!
  5. <script src="http://code.angularjs.org/angular.js"></script>
  6. <script>
  7. angular.element(document).ready(function() {
  8. angular.bootstrap(document);
  9. });
  10. </script>
  11. </body>
  12. </html>



<참조>

  - 원문 : Developer Guide - Bootstrap

posted by peter yun 윤영식