Javascript/Angular (22) 썸네일형 리스트형 angualr2 에서 infinite scroll 사용하기 먼저 npm install angular2-infinite-scroll --save 해당 명령어로 install하시고 아래와 같이 필요한 태그에다가 infinite scroll에 관련된 속성들을 삽입해 줍니다. 그다음으로 ts파일에서 아래와 같이 메서드를 삽입해 주면 끝 onScroll() {console.log('scrolled!!');//로직 들어갑니다.} angular cli 와 cordova angular cli와 cordova의 조합으로 앱을 만든 경우가 있는데요. (기존 project converting) cordova는 www폴더 이하로 소스구분을 하는데요 www폴더를 생성하기 위해 아래와 같이 .angular-cli.json을 수정해 줍니다. 혹시 external script를 추가할때는 scripts 부분에 배열형식으로 추가해 주시면 됩니다. 끝. angular 새로운 줄 생성 pipe만들기 export class NewLinePipe implements PipeTransform { transform(value: any): string { return value.replace(/\n/g, ' '); }} 위와같이만들어 주고 [innerHTML]="item.htmlTag | newLinePipe" 위와같이 쓰면 된다 angular에서 이미지가 안나올때 angular1을 4로 변경하는 작업을 하는데 image경로가 잘못 잡혀 있어서 이미지가 안나오는 경우를 발견했다. 만약 image폴더가 assets/image 로 생성되어있다면 a.jpg의 링크를 걸려면 이렇게 해주면 된다 상대로 잡지 않기를 혹 cli를 사용하시는 분이 계시다면 root 폴더가 어디로 설정되어있는지 꼭 확인하자... angular cli 에서 component 생성하기 ng generaate component TestView 또는 ng g(generate의 축약) c(component)의 축약 TestView(이름) 결과 test-view.component로생성됨 위와 같이 컴포넌트를 생성하면 ngModule에 등록 까지 자동으로 해준다 checkbox 에서 클릭시 ngModel 안바뀜 위의 경우 정상적으로 작동한다 허나 만약 event를 click으로 주게 되면 되지 않는데() angular cli 와 jquery plugin .angular-cli.json 에서 "scripts": ["../node_modules/jquery/dist/jquery.min.js","./assets/js/swipe.js"], 위와같이 추가해 주면 된다 Anagular 4 와 jquery plugin 사용하기 angular에서 jquery 플러그인을 비추하지만 빠른 개발을 위해 swipe기능을 jquery plugin으로 대체하기로함 일단 jquery 부터 설치 npm install jquery --savenpm install @types/jquery --save 그다음에 swipe js를 assets 밑에 아무데나 두자 webpack이 알아서 찾아준다 그리고 사용할 component에서 declare var jQuery:any; jQuery('.view-comment-list .article:eq(' + $index + ')').swipe({ excludedElements: [], swipeLeft: function (event, distance, duration, fingerCount, fingerData.. 이전 1 2 3 다음
