앵귤러js(AgularJS)에서 기본 제공되는 필터는 사용해 봤으니 직접 만들어서 사용해 봅시다. (참고 : 참고 : AngularJS Develop - 11 - Custom Filters ) 연관글 영역 1. 커스텀 필터(Custom Filter) 작성 앵귤러에서 필터를 추가하려면 '.filter'를 사용하면 됩니다. 아래 코드는 입력받은 값을 리턴해주는 필터입니다. app.filter('MyFilter', ['$filter', function ($filter) { return function (input1, scope, input2) { return "input1 : " + input1 + " input1" + input2; }; }]); 내용은 원하는 대로 작성하시면 됩니다. 2. 사용하기 이렇게 ..

이 필터도 앵귤러js(AgularJS)에서 기본 제공되는 필터입니다. 양이 많으니(= 기능이 많다. ) 차근차근 예제를 따라 해보도록 하겠습니다. (참고 : 참고 : AngularJS API Reference - orderBy ) 연관글 영역 1. 기본 사용법 'OrberBy'는 배열로 결과가 리턴됩니다. 그래서 'ng-repeat' 같은 것으로 사용 가능합니다. See the Pen AngularJS filter - orderBy 1 by DangGun (@danggun) on CodePen. 2. 정렬 변경하기 정렬옵션을 실시간으로 바꿔 봅시다. 이렇게 가지고 있는 데이터셋에서 필터의 옵션만 조정해 주면 앵귤러가 알아서 다시 정렬 해줍니다. See the Pen AngularJS filter - or..

앵귤러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 홈페이지로 가서 설치하려는 윈도우 버전에 맞게 설치 파일을 다운받습니다. 참고 : ..