AngularJS

1. $scope 함수로 정의 시 이를 호출하여 내부에서 스코프 변수값을 변경한 경우 바로 변경되나, 일반 함수(function)로 정의한 경우 값이 바로 변경되지 않는다. 2. 타 컨트롤러의 함수를 호출하거나 변수 값을 변경할 때는 다음과 같이 접근할 수 있다. 물론 타 컨트롤러의 스코프 함수/변수에 한해서 가능하다. const otherCtrl = $("[data-ng-controller=otherCtrl]").scope(); $scope.apply(function(scope) { scope.otherCtrlFunction(); scope.otherCtrlVar = ''; }) 3. Apply하는 방식은 아래 두 가지 방법 모두 가능하다. $scope.$apply(function() { $scope...

스코프 객체를 참조하는 것이 무한히 반복될 때 발생하는 것 같다..! 나 같은 경우에는 ng-include="스코프 변수" 형태로 URL을 동적으로 할당하고 이를 페이지에 나타나게 하려는 코드가 inlcude 되는 페이지와 include하려는 페이지 모두에 존재해 나타난 문제였다. 특정 페이지를 무한히 include하게 되는 식으로 스코프 변수에 값을 할당하는 작업이 무한히 반복되어 나타나는 바람에 문제가 발생했고, 한 쪽의 코드를 지움으로써 해결 했다.

입사하게 된 회사에서 기존의 코드를 볼 기회가 생겼다. AngularJS를 기반으로 진행된 프로젝트에 RequireJS를 사용한 것을 보고 이에 대해 간략히 정리해보고자 한다. 일반적으로 Javascript 기반의 어플리케이션을 개발하다보면 여러 파일로 분리하여 개발하게 된다. 이 경우에 유지보수성은 증대될 수 있으나, 파일의 수가 증가함에 따라 스크립트 태그의 삽입이 누락되거나 잘못 배치될 가능성이 커진다. 더불어 스크립트의 종속성을 관리하기 어려워진다. RequireJS는 JavaScript 종속성을 쉽게 관리하고, 지연로딩(Lazy-Loading)하기 위해 사용되는 Javascript 라이브러리다. 종속성을 모듈의 형태로 관리하며, 모듈을 생성하고 호출하기 위한 API를 제공한다. 1. Requir..

AngularJS에서 지시자(Directive)란 기존의 방식으로는 HTML의 DOM을 제어하기 위해 Javascript 혹은 JQuery를 사용함으로써 가능했다면, AngularJS에서는 기존 HTML을 확장하는 방식을 지시자를 통해 제공한다. 하나의 DOM에는 이와 연결되는 하나의 Directive를 만들어 해당 DOM을 조작할 수 있다. data-ng-app, ng-app ng-app으로만 사용해도 되나, 일부 HTML 편집기에서 오류가 발생하기 때문에 HTML표준 규칙을 맞춰주기 위해 data-ng-app으로 사용하곤 한다. 해당 부분부터 AngularJS를 사용하겠다는 의미로, 사용하고자 하는 모듈명을 작성하기도 한다. ng-init 자바스크립트 변수나 함수를 초기화한다. ng-model 양방향..