앵귤러JS에서는 데이터를 출력할 때 필터를 적용해서 출력할 수 있습니다. AngularJS API Reference - filter 이 포스팅에서는 배열을 필터링하는 'filter' 통화 표시 필터인 'currency' 숫자 처리 필터인 'number' 날짜 처리 필터인 date 제이썬(Json)으로 표시해주는 'json' 소문자로 바꿔주는 'lowercase' 대문자로 바꿔주는 'uppercase' 글자 갯수를 잘라주는 'limitTo' 를 다룹니다. 연관글 영역 1. filter 참고 : AngularJS API Reference - filter 배열을 필터링해주는 필터입니다. 리턴이 배열로 오기 때문에 반복문(ng-repeat)으로 활용하거나 바인딩하는 것이 가능합니다. See the Pen QGK..

'Web API'의 인증을 세션으로 관리하는 것입니다. 'REST'와는 안 맞는 구조라고 생각돼서 쓸 일이 얼마나 있을지 모르겠네요. 0. 프로젝트 준비 템플릿은 빈 템플릿을 선택해 주시고 참조는 'Web API'만 추가해 줍니다. 'App_Start'의 'WebApiConfig.cs'를 열어 라우터를 아래와 같이 수정합니다. 1 2 3 4 5 config.Routes.MapHttpRoute( name: "DefaultApi", routeTemplate: "api/{controller}/{action}/{id}", defaults: new { id = RouteParameter.Optional } ); Colored by Color Scripter cs 'Web API'만 참조하는 경우 '{action}..

'Web API'와 'Jquery'는 따로 다루는 게 맞습니다만.... 빠른 테스트를 위해서 같이 다루도록 하겠습니다. 이 포스팅의 주요 내용은 'Asp.net'의 'Web API'기능을 활용하는 방법입니다. 제이쿼리(Jquery)는 덤이죠 ㅎㅎㅎㅎ 0. 테스트 프로젝트 준비 프로젝트는 빈 템플릿에 'Web API'만 참조하여 생성합니다. 'App_Start'의 'WebApiConfig.cs'를 열어 라우터를 아래와 같이 수정합니다. 1 2 3 4 5 config.Routes.MapHttpRoute( name: "DefaultApi", routeTemplate: "api/{controller}/{action}/{id}", defaults: new { id = RouteParameter.Optional }..

Asp.net의 번들 기능(bundle)은 MVC나 WebForm없이도 사용 가능합니다. 1. 프로젝트를 생성 프로젝트를 생성할 때 핵심 참조를 'Web API'만 합니다. 프로젝트에 'Test.js'를 추가하고 아래 코드를 넣어 줍니다. 1 2 3 4 var funCall = function() { alert('호출 되었습니다.'); } cs 프로젝트에 'Test.css'를 추가하고 아래 코드를 넣어 줍니다. 1 2 3 4 body { background-color:#ff6a00; } cs 2. 참조 추가 누겟으로 'Optimization'를 검색해 봅니다. 'Microsoft.AspNet.Web.Optimization'을 설치하시면 됩니다. 한국어버전은 'Microsoft.AspNet.Web.Opti..

제목이 좀 이해하기 힘들겠지만.... 티스토리에서 제공되는 치환자는 특정 데이터를 바인딩하는 기능 외에도 티스토리 자체에서 제공하는 스크립트를 로드하는 역할도 합니다. 예를 들면 바디영역에 선언하게 되어 있는 ''의 경우 '댓글 펼침'기능이 들어있는 자바스크립트를 로드하게 됩니다. 만약 ''를 제거한다면 댓글 펼침 시 에러가 나는 걸 볼 수 있습니다. 티스토리 스크립트에 'toggleLayerForEntry'함수가 들어있는 스크립트가 'common.js'인데 ''가 있고 없고에 따라 다른 스크립트를 불러온다는 것을 알 수 있습니다. 다른 사람의 티스토리 코드를 사용할 때 이것을 주의해야 합니다. 에러 내용을 잘 확인해서 치환자를 사용해야 하죠. 티스토리의 자체 스크립트를 제거하고 자신이 새로 구축하려면 ..

제가 기초설명은 잘 안 하는데 R언어는 일반적인 언어와 다른 특성이 좀 있어서 간단하게 설명을 하겠습니다. 1. 데이터 R언어에서 모든 데이터를 배열에 넣습니다. R스튜디오(RStudio)를 열고 콘솔에 다음 코드를 넣어 봅시다. 1 2 3 4 5 6 > 1 + 1 [1] 2 > 100:130 [1] 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 [19] 118 119 120 121 122 123 124 125 126 127 128 129 130 cs 첫 번째 코드는 '1 + 1'의 결과가 배열에 1번에 들어갔다는 것입니다. 두 번째 코드는 100~130까지 들어있는 배열을 만들었다는 것입니다. 두 번째 코드처럼 순차적인 ..

타입스크립트(TypeScript)는 마이크로 소프트에서 만든 자바스크립트 확장입니다. (참고 : Microsoft - TypeScript ) 앵귤러js2(AngulraJS) 때문에 해야 할 것이 많군요 ㅜㅡ 어찌 되었건 설치해봅시다! 1. 다운로드를 받자! 도구 > 확장 및 업데이트 로 누겟(Nuget)을 열고 타입스크립트(TypeScript)를 검색하면.... 아래와 같이 나옵니다. 하지만 다 훼이크고 클릭하면 다운로드 페이지로 넘어갑니다 ㅎㅎㅎ 가장 최신 버전을 클릭해봅시다.(2.0.3) 아래와 같이 다운로드 페이지가 나오는데 다운로드 받습니다. 다운받아서 설치하시면 됩니다. 참 쉽죠? npm이 설치되어 있다면? npm이 설치되어 있다면 아래 명령어로 타입스크립트의 최신 버전을 설치할 수 있습니다. ..

node.js를 쓸 일이 있을까? 라는 생각을 하던 시절이 있었는데..... 앵귤러JS(AngulraJS)가 2버전으로 올라가면서 'Node.js'를 쓰게 되면서 이제는 정말 'Node.js'를 배워야 할 때가 왔습니다. ㅎㅎㅎㅎ 'Node.js'를 활용하려면 NPM(Node Packaged Modules)도 있어야 하니 같이 설치하고 세팅해 보겠습니다. NPM은 Node에서 사용하는 모듈을 모아둔 패키지 입니다. (참고 : nodejs.org - Node.js 소개 ) 1. Node.js 노드js의 윈도우 버전은 인스톨러(Windows Installer, .msi)를 제공하기 때문에 원터치로 설치가 가능합니다! 노드js 홈페이지로 가서 설치하려는 윈도우 버전에 맞게 설치 파일을 다운받습니다. 참고 : ..

티스토리의 페이징 처리는 자동으로 바인딩해주기 때문에 css만 신경 쓰면 되는데.... '...'은 따로 노는 현상이 있습니다. 오노!!! 1. 원인 html을 확인하면 '...'만 'li'태그가 없는 것을 확인할 수 있습니다. 아마도 티스토리 쪽에서 '...'은 바인딩 처리를 하지 않는 거 같네요. 2. 해결 방법 css를 조작할 수 있다면 '.interword'를 재정의 하여 처리하시면 됩니다. 다른 방법은 자바스크립트(javascript)를 이용하는 방법입니다. css를 조작하는 건 html작업과 연관 있으니 각자 처리해야 합니다. 저는 제이쿼리(jquery)를 이용하여 '...'을 ''로 감싸는 방법을 사용하겠습니다. ''로 감싸주기만 하면 상속받은 스타일이 먹힐 테니 별도의 작업이 필요 없다는 ..

여러 가지 이유로 지정한 요소를 특정 태그로 감싸주어야 할 때가 필요합니다. 1. 제이쿼리(Jquery)를 이용한 방법 제이쿼리는 '.wrap()'함수가 있으므로 쉽습니다. //$([검색식]).wrap([추가할태그]); $('.interword').wrap(''); 2. 자바스크립트(javascript)를 이용하는 방법 자바스크립트는 살짝 힘듭니다. 요소를 찾아서 넣고 하는 작업이 필요하기 때문이죠 ㅎㅎㅎ //태그를 추가할 태그를 찾고 var div = document.getElementById('wrapMe'); //태그를 생성하고(여기선 'a') var link = document.createElement('a'); //기존 태그 내용을 추가해주고 link.innerHTML = div.outerHTM..