[angularjs] ng-app 지시문의 배치 (html vs body)

최근에 angular로 빌드 된 webapp의 코드를 검토 한 결과 태그 ng-app="myModule"에 지시문 이있는 것으로 작성되었습니다 <body>. 앵귤러를 배울 때 <html>, 앵귤러 문서가 여기 , 여기 , 그리고 그들의 튜토리얼 에서 권장하는대로 태그에서 사용되는 것을 본 적이 있습니다 .

나는이 내 자신에 조금 탐구 및 SO 질문, 특히 발견했습니다 이것 과 유사하게 이 한 페이지에 여러 모듈을로드 논의. 그러나이 기술 은 본문 내의 요소에 ng-app을 배치 하고 수동 부트 스트랩을 사용하여 두 개의 각도 앱을 동시에 실행 하는 것과 관련이 있으므로 필자의 경우와 다릅니다 .

내가 알 수있는 한, 런타임 ng-app에 on <html>또는 <body>. 내가 알기 ng-app로는 각도 응용 프로그램의 루트를 지정하므로 각도 응용 프로그램에 배치하면 각도 범위에서 <body>잘릴 <head>수 있지만 이것이 영향을 미치는 주요 방법을 생각할 수 없습니다. 그래서 제 질문은 다음과 같습니다. ng-app이 태그 중 하나를 다른 태그 대신에 배치 하는 것의 기술적 차이점은 무엇입니까 ?



답변

어디에 두 었는지 큰 차이가 없습니다 ng-app.

당신이 그것을 <body>입으면 AngularJS에 대한 더 작은 범위가 약간 더 빠릅니다.

하지만 사용한 ng-app<html>을 조작하기위한 <title>.


답변

저는 레거시 앱을 작업하는 팀에 있었는데 레거시 코드에서 새 코드를 분리하기 위해 래퍼로 사용되는 div에서 ng-app 태그를 사용하는 것이 가장 좋습니다.

우리는 jqGrid 및 Dojo에 크게 의존하는 앱에서 작업하면서이를 발견했습니다.

헤드 태그에 ng-app을 추가하면 사이트가 터졌지만 래퍼를 사용하면 문제없이 Angular를 사용할 수있었습니다.


답변

AngularJS가 찾은 첫 번째 ng-app을 부트 스트랩합니다! 그게 다야. 하나 이상의 ng-app이있는 경우 첫 번째 앱만 처리합니다. 다른 요소를 부트 스트랩하려면 angular.bootstrap ()

ng-app 속성의 값은 다음을 사용하여 생성 된 모듈입니다.

angular.module("module_name", [])

모듈은 다른 프로그래밍 언어와 달리 main () 메서드가 없기 때문에 angular가 부트 스트랩되는 방법을 정의합니다. ng-app의 값이 비어 있으면 기본 모듈 인 ‘ng’를 사용하도록 기본 설정됩니다.

angular는 ng-app이 있던 요소 내부의 모든 요소를 ​​처리하기 때문에 약간 더 빠르다고합니다. 그러나 매우 부피가 큰 DOM을 사용하지 않는 한 차이가 전혀 눈에 띄지 않을 것이기 때문에 나는 약간 의심합니다.

여기에 예제가 필요하면 http://noypi-linux.blogspot.com/2014/07/angularjs-tutorials-understanding.html


답변