고무망치의 Dev N Life 고무망치의 Dev N Life

소스 다운로드 > https://github.com/cpromise/realtimeChat이 예제에 사용된 소스 : Use Camera and Album(Just take a picture and do nothing with it)을 다운로드 받으시면 됩니다.이 예제를 완성시킨 소스 : Send a image through the camera and the album.을 다운로드 받으시면 됩니다. 1탄 보러가기(클릭) 아니.. 사진 전송이 없는 채팅. 요새 상상이나 할 수 있을까요?아뇨. 없을 겁니다. 그래서 준비했습니다. 호홓 따라오쇼~ STEP 1. 사진 촬영/선택 후 이벤트 처리**편의상 모든 설명은 사진 촬영 기준으로만 합니다.**앨범에서 선택하는 것 또한 동일하오니 복붙해주시면 됩니다. gith..

본격 Ionic에 jQuery라이브러리 추가하기. 워낙에 간단하지만 Ionic을 처음 켜보고 구조를 잘 모르실 분들을 위해 포스팅합니다. STEP 1. jQuery 다운받기. https://jquery.com/ 에 접속하셔서 다운로드 받아주세요. 버전이나 파일은 아무거나 받으셔도 왠만한거 다됩니다. 다운은 어디로? 내 프로젝트 lib폴더로!! 저같은 경우는 파일의 경로가 /realtimeChat/www/lib/ionic/jsj 가 되겠네요. STEP 2. index.html에서 jQuery 참조시키기 index.html 파일을 보시면 여러가지 셋팅이 되있습니다. 그중 아무곳에서 를 쳐주시면 되겠습니다. (복붙하시면됩니다_) 그 뒤 컨트롤러에서 jQuery선택자를 통해서 편하시게 작업하시면 됩니다!!!

1탄 보러가기 소스 다운로드 > https://github.com/cpromise/realtimeChat initAgain을 다운로드 받으시면 완성된 샘플소스를 보실 수 있습니다. Firebase로 실시간 채팅만들기 2탄이 다가왔습니다. 오늘은 코딩을 하지 않고 코딩을 위한 준비만 하도록 하겠습니다!! 혹시라도 IONIC설치가 궁금하신분은 댓글달아주시면 5분안에 텨옵니다.ㅎㅎ STEP 1. IONIC 프로젝트를 만들어주세요. 프로젝트를 만드실 위치에서 ionic start realtime-chat 프로젝트가 생성이 되었습니다.!!! realtime-chat 디렉토리로 들어가서 ionic serve를 실행해줍니다. serve를 해주면 바로 웹브라우저에서 기본 앱이 실행이 되네요. 채팅에 걸맞는 셋팅을 하기..

IONIC에서는 LIST나 다른 여러 컴포넌트를 사용하면 자동으로 스크롤을 만들어주죠? 근데 이 스크롤 위치(화면위치) 를 제어하기가 쉽지 않습니다. IONIC에서는 transform : translate3d(x,y,z); 을 사용해서 스크롤 효과를 주고있습니다. 이 css를 제어하는 것 대신 매우 손쉽게 스크롤의 위치를 제어할 수 있는 방법을 채팅기능과 관련하여 소개해드릴게요. 사용된 코드는 이렇습니다. chat.html {{chat.user}} {{chat.message}} app.js (controller를 그냥 app.js에 선언해놓았어요.) imageApp2 //ng-repeat 종료 이벤트를 위한 디렉티브선언.. 이전 블로그 참조하세요 .directive('ngRepeatEndWatch', f..

ng-repeat이 끝났을 때 특정 메소드를 실행하고 싶을수가 있다. 예를 들어 alert( 108건의 데이터가 조회되었습니다. ); 같은 횟수를 체크하고 싶은 경우도 있고.. 아무튼 볶음고추장처럼 알아두면 언제든 사용할 수 있을만한 꿀팁!! 1. controller.js 에 directive 추가해주기 angular.module('starter.controllers', ['firebase']) .controller( 'sampleCtrl', function().....); .controller( 'sampleCtrl2', function()....); 이렇게 사용하고 계실텐데, 아래와 같이 수정해주세요. angular.module('starter.controllers', ['firebase']) ///..