싱글페이지를 위해 앵글러를 사용도중 js 불러오기가 마음에 들지 않아서 질문 드립니다.
열심히 썻는데 그림이 작게 나오네요;;ㅠㅠㅠㅠ
우선 앵글러는 싱글 페이지이기 때문에 index.html로 해결을 다합니다.
그리고 라우팅에 따라서 ng-view를 이용하여 index.html안에 다른 xxx.html을 불러오고 있습니다.
여기서 궁금한점이 있습니다. 오른쪽에 보시면 불러올 page1.html이 있습니다. 그리고 pag1.html에서는 page1Ctrl가 정의되어 있습니다.
이 pageCtrl는 pageCtrl를 정의한 js 파일이 없으면 무용지물이 되어 벌비니다. 앵글러의 동작을 하지 않습니다. 그렇기 때문에
pageCtrl를 정의한 pageCtrl.js를 idex.html에 불러온걸 볼수 있습니다.
저렇게 되면 ng-view에서 아직 page1Ctrl을 쓰진 않았지만 index.html페이지 상에서는 이미 pageCtrl.js를 불러온 상황입니다.
그렇게 된다면 만약 페이지가 20개가 넘는다면...
이렇게 index.html에 20개의 js를 다 불러와야 합니다... 실제로 저렇게 쓰고 있습니다;;
그렇게 되면 매 페이지마다 20개의 js를 수시로 불러오게 됩니다;; node js에서 express로 jade기반일때에는
page1.html을 불러오면 page1.html안에 <script src='page1.js'></script>를 불러오게 했습니다.
이게 당연히 맞는거지요 xxx.html을 불러오면 그거에 맞는 xxx.js도 불러오는게 맞습니다.
그래서 저는 아래 그림과 같이 해봤습니다.
차이점을 아시겠나요? index.html에 page1.js를 미리 설정한것이 아닌
page1.html안에 page1.js를 설정했습니다. 하지만... 이렇게하면 실제 동작이 이루어 지지 않습니다;;
왜 이러한 현상이 일어나는걸까요?
page1.html를 불러오고 그다음에 page1.js를 불러와서 page1.html안에 있는 js동작들이 실행이 안되는걸까요?
지금 제가 쓰는 방법이 너무 비효율적이라서 이렇게 질문을 드립니다.