전체보기
HTML
CSS
JAVASCRIPT
PYTHON
REACT
VueJS
JQUERY
LINUX
PHP
DATABASE
LODASH
WEBDEVETC
ETC
Search
JSON Pretty
Close
CATEGORIES
JSON Pretty
HTML
CSS
React
VueJS
Javascript
jQuery
Lodash
Python
Database
Linux
WEBDEVETC
ETC
Search
Contact Us
LATEST POSTs
최근 등록된 포스팅 목록
최신순
인기순
angularjs
[AngularJS] 파일 변경시 자동 리로드되는 끄는 방법, 자동 리로드 해제
AngularJS 앱을 로컬 개발 환경에서 실행하는 경우 ng 스크립트에서 자동으로 파일이 변경되면 리로드하도록 기본값이 설정됩니다. auro reload가 되는데요 ~ 만약 자동 리로드를 끄려면 어떻게 해야 하는지 알아봅니다.# AngularJS 로컬 개발시 자동 리로드 비활성화 하기방법은 간단합니다. 로컬 웹서버를 ng server로 띄울 때 옵션을 변경하면 되죠. 이때 사용할 옵션이 바로 --live-reload
View :
974
/
2020-02-17
angularjs
[AngularJS2] select 태그 option에 for문 사용시 기본값 사용 방법
AngularJS에서 select 태그의 option에 ngFor를 사용하는 경우 기본값을 사용하는 방법을 알아봅니다.# select 태그 ngfor문에 기본값 사용하기먼저 기본값을 사용하기 위해서는 ngFor가 적용된 option 태그에 [selected]를 사용해야합니다.[selected]="조건값"조건이 true인 경우에는 기본값
View :
1844
/
2020-02-16
angularjs
AngluarJS 더블 클릭 이벤트, ng-dblclick() 알아보기
angularjs에서 이벤트를 동작시킬때 클릭이 아닌 더블 클릭을 태그 요소에 바인딩하는 방법을 알아봅니다.# angularJS 더블 클릭 디렉티브더블 클릭을 위해서 ngDblclick 디렉티브를 사용할 수 있습니다.ngDblclick
View :
1983
/
2018-08-07
angularjs
AngularJS에서 route에서 controller as 사용방법
AngularJS에서 $routeProvider를 사용하는 경우 template, controller 등을 설정할 수 있습니다.만약 html에 사용하는 컨트롤러에 별칭을 사용할 수 있도록 'controller as' 선언처럼 route설정시 사용하는 방법은 무엇일까요?# routeProvider 설정시 컨트롤러의 별칭 사용하는 방법이 경우 route 설정 옵션으로 controllerAs를 사용
View :
1041
/
2018-08-06
angularjs
angular cli는 무엇이고 설치 및 사용방법
AngularJS를 사용한 새로운 어플리케이션을 만드는 경우 angluar cli를 많이 사용합니다. angularcli를 사용하면 유용한 툴 및 개발환경을 빠르고 쉽게 구축할 수 있습니다. angular cli의 특징은 아래와 같습니다.AngularJS를 사용한 신규 프로젝트를 생성함어플리케이션 개
View :
2950
/
2017-12-19
angularjs
AngularJS Routing, 라우팅 관련 이벤트 알아보기
AngularJS를 사용하여 라우팅(Route)을 사용하는 경우 이와 관련된 다양한 이벤트를 제어 및 동작할 수 있습니다. 아래는 route 시작, 업데이트 등등의 관련 이벤트를 자세히 알아보도록 하겠습니다.# Route 라우팅 관련 이벤트 알아보기먼저 route
View :
1963
/
2017-11-16
angularjs
AngularJS 라우팅 설정 locationProvider.html5Mode() 역할은?
AngularJS는 라우팅 기능(Route)을 제공하여 접속된 url에 해당하는 페이지 소스를 보여줄 수 있습니다. 이때 적용된 코드에서 아래와 같은 코드를 쉽게 만날 수 있습니다.angular.module().config(function($locationProvider) { $locationProvider.html5Mode(true); ...});위 코드의 <
View :
2838
/
2017-11-16
angularjs
AngularJS에서 $http 요청 제어 및 취소하는 방법과 예제보기
AngluarJs에서 비동기 방식의 ajax를 $http 서비스를 사용하여 수행할 수 있습니다. 이때 만약 request에 대한 특정 명령이나 취소 등을 수행하려면 어떻게 할 수 있을지 아래에서 알아봅니다. 우선 취소하는 방법 부터 알아봅니다.# $http 요청 취소하는 방법 먼저 취소를 위해서는 현재 pending된 request가 있는지 알아야합니다. 이때 <span data-custom-style="
View :
2579
/
2017-11-06
angularjs
uibtab을 사용할 경우 tab 메뉴에 disable 사용하는 방법
AngularJS의 부트스트랩을 사용하여 tab 메뉴의 ui를 구현하는 경우 만약 disabled 시키는 방법입니다. 쉽게 생각하기를 disabled 속성을 주면되지 않을까라 생각할 수 있으나 실제로는 동작하지 않습니다. 만약 아래 태그가 있다고 가정해보겠습니다.# uibtab 메뉴의 disabled 적용하는 방법먼저
View :
2814
/
2017-10-13
angularjs
AngularJS에서 forEach를 사용하는 반복문 알아보기
AngularJS에서 객체 또는 배열에 반복문을 사용하는 방법에 대하여 알아봅니다. 많이 사용되는 for문 외에 key, value로 객체의 프로퍼티를 반복하여 실행하는 반복문 사용이 가능한 forEach() 구문을 사용할 수 있습니다. 아래는 간단한 사용방법입니다.forEach(items, function(key, value) { // Code here});
View :
6650
/
2017-09-27
angularjs
angularjs stateProvider에서 $state.go 사용하는 방법
AngularJS를 사용하여 SPA(Single Page Application)으로 구현하는 경우 페이지 이동 즉, 현재 페이지에서 다른 페이지로 이동하는 방법으로 routeProvider 또는 stateProvider를 사용합니다. 만약 stateProvider를 사용하는 경우 $state를 사용하여 페이지 이동이 가능합니다. 아
View :
5609
/
2017-09-27
angularjs
AngularJS에서 ng-bind-html로 html 문서 출력하는방법
AngularJS에서 html 코드를 html 파일에서 출력하는 방법을 알아봅니다.! HTML출력시 sanitize를 사용하는 이유는?AngularJS에서 html을 출력하려면 sanitize를 거쳐야 가능합니다. 그렇지 않으면 html 태그가 적
View :
8905
/
2017-08-14
angularjs
[AngularJS] select 태그에 ng-model 적용시 option 요소가 생기는 문제
AngularJS의 select태그에 ngModel을 사용하는 경우 아래와 같은 문제가 발생하였습니다. 의도하지 않은 option 요소가 나타납니다.이런 이슈가 나타나는 이슈는 ng-model이 적용된 select 태그가 undefined 상태의 option값을 만들기 때문입니다. 이를 해결하기 위한 방법이 딱히 없는데 그 중에서 가장 간단하고 효과적인 방법이 css를 사용하는 방법입니다.# select 태그의 option 엘리먼트 해결방법<br
View :
2995
/
2017-08-08
angularjs
angularjs ngValue 디렉티브 사용하기
AngularJS에서 ngValue를 사용하는 방법입니다. ngValue는 ngSrc와 비슷하게 동작하며 해당 값을 생기거나 불러오면 value 속성에 값을 추가합니다. 아래와 같이 사용합니다.<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" data-cke-filter="off" class="cke_widget_wrapper cke_wid
View :
3134
/
2017-08-08
angularjs
AngularJS에서 jsonPadding 실행시 undefined 에러가 나는 경우
만약 AngularJS에서 JsonPadding을 사용하는데 Undefined가 발생하는 경우 해결하는 방법입니다. 해당 이슈는 jQuery에서는 잘 동작하지만 AngularJS에서 동작하지 않는 경우에 해결될 수 있습니다. 일단 undefined는 아래처럼 메시지가 나타납니다.JSONP_CALLBACK is not defined문제의 원인은 angularJS는 JSONP 방식으로 받게 될 callbak 함수의
View :
1202
/
2017-07-27
angularjs
AngularJS에서 AJAX를 불러온 후 코드를 실행하는 방법
AngularJS에서 AJAX 콜백을 받은 후에 코드를 수행하는 방법에 대하여 알아봅니다. 먼저 생각할 수 있는 부분은 아래와 같이 3가지가 있습니다.Promise를 넘겨주는 방법$watch 서비스를 사용하는 방법ng-if를 사용하는 방법위 세가지 방법을 사용하여 가능합니다.# Promise를 사용하는 방법ajax에서 전달받은 promise를 return 받아 .then()에서 코드를
View :
1985
/
2017-07-19
angularjs
AngularJS ngClick 사용시 이벤트 객체를 받아오는 방법
ngClick 디렉티브를 사용하여 이벤트를 호출시 클릭했던 엘리먼트를 불러오는 방법에 대하여 알아봅니다. 만약 아래 코드의 버튼을 클릭한 후 ng-click 디렉티브에서 클릭된 event 객체의 요소를 알아내려면 어떻게할까요?# AngularJS 클릭한 요소 알아내기먼저 클릭이벤트가 발생할 경우 자바스크립트는 이벤트 객체에 해당 정보를 저장합니다. 이벤트 객체를 angular js에서 반환받는 방법과 어떤 속
View :
8301
/
2017-07-07
angularjs
angularJS의 ngOptions 설정시 숫자만 사용하는 경우 방법
select 태그를 사용하여 선택 옵션을 주기 위한 방법으로 AngularJS의 ngOptions 디렉티브를 select 태그에 설정하여 사용할 수 있습니다. 이때 만약 option 값들이 숫자로만 이루어진 경우라면 가장 간단한 방법으로 구현할 수 있습니다.# AngluarJS에서 숫자로만 구성된 select 태그를 ngOptions 사용해 만들기숫자로만 구성된
View :
1630
/
2017-07-06
angularjs
AngularJS에서 ngChecked 사용하여 체크박스, 라디오 체크 변경하기
AngularJS의 ngChecked 디렉티브에 대하여 알아봅니다.# ngChecked 디렉티브ngChecked 디렉티브는 input 태그등에 사용하는 checked 속성의 상태를 적용합니다. 예를들어 체크박스, 라디오박스 체크상태 등을 보여줄 수 있습니다.만약 html 코드에 나타날 체크박스가 체크상태로 나타나야 하는 경우 이를 아래와 같이 사용할 수 있습니다.<div tabindex
View :
8757
/
2017-06-22
angularjs
angularjs에서 ngNonBindable 디렉티브를 사용한 컴파일 피하기
AngularJS 사용시 compile 되지 않아야 할 부분이 있을때 아래 디렉티브를 선언하여 가능합니다. ngNonBindable 예를들어 아래 코드의 {{ test }} 표현식이 존재할 경우 이를 prevent하여 코드 그대로 표현 할 수 있습니다. 이때 컴파일 되지 않고 바로 보여주게됩니다.<
View :
1568
/
2017-06-20
angularjs
Angular factory() 메소드로 서비스 모듈 만들기
AngularJS에서 모듈을 생성하고 사용하는것은 매우 중요한 부분입니다. 아래는 .factory()를 사용하여 커스텀 서비스를 만들고 이를 디렉티브에 적용하여 사용하는 간단한 예제입니다.먼저 myApp에 커스텀서비스인 customServices를 생성하고 서비스명 testService에 메세지를 보여줄 showmsg() 메소드를 만들어봅니다.<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" dat
View :
2356
/
2017-06-20
angularjs
AngularJS의 jqLite를 사용하여 scope내의 콘트롤러를 찾는 방법
AngularJS의 jqLite를 사용하여 scope내의 콘트롤러를 찾는 방법은 무엇일까요?먼저 원하는 컨트롤러가 사용된 엘리먼트를 찾습니다. 만약 아래와 같은 코드가 있다면..<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" data-cke-filter="off" class="cke_widget_wrapper cke_widget_block cke_widget_codeSnippet" data-cke-display-name
View :
1440
/
2017-06-19
angularjs
AngularJS에서 title 속성을 추가하는 방법, ngAttrTitle
AngularJS에서 title 속성을 추가하는 방법은 무엇일까요? 아래는 ngAttr 디렉티브를 사용한 ngAttrTitle에 대하여 알아봅니다.ngAttr 디렉티브는 선언할 속성을 함께 사용할 수 있는 특징이 있습니다. 그래서 우리가 생성할 title 속성은 아래와 같이 사용할 수 있죠.<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" data-cke-filter="off" class="cke_widget_wrappe
View :
2094
/
2017-06-14
angularjs
AngularJS에서 ngStyle을 사용한 스타일 추가하기
AngularJS에서 태그 요소에 바로 CSS 스타일을 추가하기 위한 방법으로 ngStyle 디렉티브를 사용할 수 있습니다.만약 아래와 같은 스타일을 다음과 같은 방법으로 추가하는 것이 가능합니다.<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" data-cke-filter="off" class="cke_widget_wrappe
View :
3408
/
2017-06-05
angularjs
AngularJS 내부의 jqLite 메소드 scope() 알아보기
AngularJS 내부의 jqLite 메소드 scope()에 대하여 알아보겠습니다.# jqLite 내부의 scope() 메소드가 하는 일먼저 jqLite는 AngularJS 내부에서 사용되는 간단한 제이쿼리 엔진입니다. 제이쿼리의 일부 기능들이 동작하도
View :
1236
/
2017-06-01
angularjs
AngularJS에서 AJAX를 끝마치고 하위 디렉티브에 이벤트 콜백 함수를 호출하는 방법들
AngularJS에서 AJAX를 끝마치고 다른 디렉티브 ~ 하위 디렉티브에 이벤트 콜백 함수를 호출하는 방법들은 무엇이 있을까요?# $broadcast를 사용한 이벤트 전달 방법# $watch와 변수 isLoaded를 사용하는 방법# Directive의 scope 설정시 ajax 호출 함수를 추가하는 방법위 방법이 있을 것 같습니다. 세 가지 모두 자주 사용되는 방법입니다. 일반적인 경우 1번 $broadcast가 많이 사용될 것입니다
View :
1960
/
2017-05-25
angularjs
AngularJS 날짜 filter를 사용한 표현 방법
AngularJS 날짜 filter를 사용한 표현 방법<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" data-cke-filter="off" class="cke_widget_wrapper cke_widget_block cke_widget_codeSnippet" data-cke-display-name="code snippet" data-cke-widget-id="0" role="region" aria-label="code snippet wid
View :
2786
/
2017-05-24
angularjs
angularjs 링크함수 내부의 $watch 내부 값이 변하지 않는 경우
만약 angularjs 디렉티브가 존재하고 링크함수가 있다고 가정했을때 내부에 위치한 $watch를 통하여 값을 변경하는 경우 동작하지 않는 경우가 발생할 수 있습니다.이 경우 $watch 내부의 모델값이 정상적으로 업데이트 되지 않는데 이 경우 setTimeout 또는 $timeout을 사용하여 해결될 수 있습니다.<div tabindex="-1" contenteditable="false" data-cke-widget-wrapper="1" data-cke-filter="off" class="cke_wi
View :
1335
/
2017-05-23
angularjs
angularjs 내장 서비스 알아보기
angularjs 내장 서비스 알아보기$anchorScroll해당 앵커 위치로 이동시킴$animatetransition 애니메이션 기능을 구현$complie$controller
View :
843
/
2017-05-18
angularjs
AngularJS에서 커스텀 디렉티브 생성시 scope에 대한 의존성을 선언하지 않는 이유
AngularJS에서 커스텀 디렉티브 생성시 scope에 대한 의존성을 선언하지 않는 이유는?디렉티브의 경우 컨트롤러와 달리 다수의 모듈에 사용가능하기 위하여 특정 Scope에 대하여 의존성을 선언하지 않으며 필요한 Scope만 선택하거나 별도의 구분된 Scope을 생성합니다. 이런 이유로 여러개의 모듈에 동시 사용이 가능합니다.
View :
732
/
2017-05-17
First
1
2
Next
Last