lab.naminsik
  • Javascript, jQuery
  • Reactjs
  • React Native
  • iOS
  • Android
  • AWS
  • Server
  • Html, CSS
  • Php
  • asp .net
  • SQL
  • Word Press
search
keywords
  • Angularjs 2016‧09‧08

    스코프 데이터 html로 바인딩하기

    예를 들어 $scope.text1 = '<h3>제목</h3>';라고 있고 dom에서 {{text1}} 하면 바로 <h3>제목</h3>가 노출된다.이를 html로 적용시키려면 아래와 같이 만들어야한다. 방법 1. 헤더에서 angular-sanitize 를 불러와준다.  <script src="/angular-1.5.8/angular-sanitize.min.js"></script>  모듈에 ngSaitize를 넣어준다. var app = angular.module('모듈이름',['ngRoute','ngAnimate','ngSanitize'], function($httpProvider){ });  이제 준비가 되었다. dom에는 아래와 같이 넣어준다. <p ng-bind-html="text1"></p> 그럼 제대로 데이터가 html로 바인딩 된 것을 확인할 수 있다. 방법 2. […]

  • Angularjs 2016‧01‧19

    동적으로 외부파일 불러와서 dom에 바인딩($http, ng-view, ng-include 3가지 활용)

    html 중에 메뉴를 아래와 같이 만들었다 가정합니다. index.html <div class="btnClick" ng-controller='gnbNav' > <nav id="lnb"> <ul> <li ng-repeat='gnbMenu in gnbMenus' > <button ng-click="callProject()"> <div class="listNumber">{{gnbMenu.Num}}</div> <h2>{{gnbMenu.title}}</h2> <span>{{gnbMenu.date}}</span> </button> </li> </ul> </nav> </div> 그리고 메뉴 구조를 아래처럼 변수에 담아두겠습니다. app.js var gnbLoad = [ {Num : "2", title : "테스트2", date : "2015.8.1", url : "test2.html"}, {Num […]

  • Angularjs 2015‧02‧12

    Angularjs - 외부 json 파일 불러와서 dom에 바인딩 시키기

    코드 출처 : http://codepen.io/tutorialab/pen/EJAet?editors=101 <div id="wrapper" ng-app> <div ng-controller="DataCtrl"> <pre ng-model="data"> {{data}} </pre> <input ng-model='name' /> {{name}} <input ng-model='salutation' /> {{salutation}} <input ng-model='greeting' /> {{greeting}} </div> </div>  위 처럼 html 을 만든다. angular.module('', []); function DataCtrl($scope, $http) { $http.jsonp("http://angularjs.org/greet.php?callback=JSON_CALLBACK&name=Super%20Hero"). success(function(data) { $scope.data = data; $scope.name = data.name; $scope.salutation = data.salutation; $scope.greeting = data.greeting; }). error(function (data) […]

  • Angularjs 2015‧02‧12

    Angularjs - jsonp 불러오기

    외부에 있는 json 파일을 불러오는 코드이다. 출처 : http://jsfiddle.net/zkfruxu3/ <div ng-app ng-controller="jsonp_example"> <button ng-click="doRequest()">Make JSONP request</button> </div>  위 처럼 html 안에 버튼을 클릭하면 doRequest 함수가 실행되게 만든다. function jsonp_example($scope, $http) { $scope.doRequest = function() { var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK"; $http.jsonp(url) .success(function(data){ console.log(data.found); }); }; var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK"; $http.jsonp(url) .success(function(data){ console.log(data.found); }); }  외부 파일을 $http.jsonp을 통해 […]

  • Javascript, jQuery 2015‧01‧26

    jQuery - Ajax로 데이터 불러오기

    외부 데이터를 불러올 때 Ajax를 통해서 가져오는 경우가 많다. Ajax를 통해서 Json 형식의 파일을 불러오는 예제를 만들면 아래와 같다. $.ajax({ type: "GET", url: "파일경로및 파일명", dataType: "json", cache: false, success: function(data){ $.each(data.dataList,function(index){ $('li').eq(index).html(data.dataList[index].val); }); },error: function(XMLHttpRequest, textStatus, errorThrown) { console.log("Status: " + textStatus); },timeout: 3000 });  설명하자면 timeout 에 3000을 입력해둔 것은 외부 데이터를 불러오는 […]

popular

  • react, vue - Uncaught SyntaxError: Unexpected token
  • MSSQL - 두 테이블간 컬럼의 값들에 일치하는 항목 추출
  • mac 에서 ssh ppk 키 pem 키로 변환 및 접속
  • Github, AWS EC2, Next.js CI/CD 자동화 + Slack 연동
  • 동영상 스트리밍 서비스 구축 1장 (AWS s3/cloudFront, HLS, video.js)
  • 이미지와 텍스트 정렬 (위 이미지, 아래 텍스트)
  • MSSQL - 난수 쿠폰 코드 생성, 중복 없이 테이블에 등록
  • Photoshop - 폰트는 폴더를 따로 관리하는 것이 좋다.
  • react native - Flatlist 의 하위 아이템 중 원하는 아이템으로 스크롤 시키기 (scrollToIndex)
  • css - div에 글자 입력 받고 placeholder 넣기

comment

  • 감사합니다
  • 핫!! 감사합니다.
  • 감사합니다 선생님 꽃길만 걸으십쇼!...
  • 😁
  • wow 답변 감사합니다!!!