팝업에 보여질 html, js의 파일명이 아래와 같을 때, 다음과 같이 다이얼로그를 실행시킬 수 있다. sample.html resources/js/sample.js Open jQuery의 load() 함수를 통해 html을 로드해와서 이것을 dialog() 함수를 통해 다이얼로그로 열 수 있다. 이 때 관련 js 파일이 함께 로드되도록 하기 위해 해당 함수(openDial)가 실행될 때마다 requireJS의 undef() 함수로 js 파일을 초기화시켜준다. 팝업을 닫을 때 해당 js 파일을 초기화시켜주기 위해 jQuery Dialog에서 제공하는 beforeClose() 함수 내부에 초기화시켜주는 코드를 추가한다.
Frontend/AngularJS
replace가 true인 경우, template 또는 templateUrl은 최상위 element를 반드시 가져야 한다. 즉, replace값이 true인데 directive의 옵션으로 template:"Hello AngularJS"과 같이 element가 없는 경우에는 위의 오류가 발생하는 것이다. 따라서 최소 하나의 element를 주거나 하나 이상의 element가 포함된 templateUrl을 부여하면 된다. angular .module("exApp", []) .controller("exCtrl", ["$rootScope", "$scope", ..., function ($rootScope, $scope, ...) { ... } ]) .directive('directiveEx', function(..
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에는 기본 내장 디렉티브들뿐만 아니라, 사용자가 직접 디렉티브를 생성해서 사용할 수도 있다. 디렉티브를 생성하는 데에는 기본적으로 아래의 구조를 따른다. var app = angular.module("모듈명", []) app.directive("디렉리브명", [], function(){ return { restrict: E/A/C/M(조합 가능), template/templateUrl: "", replace: true/false, priority: x transclude: true/false, scope: true/false, {...} } }); 디렉티브를 생성할 때에는 아래와 같은 옵션들을 줄 수 있다. 1) restrict 디렉티브를 적용할 DOM element의 속성을 의미한다. ..
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 양방향..
보호되어 있는 글입니다.
