Ionic은 현재 가장 유망한 HTML5 모바일 애플리케이션 개발 프레임 워크입니다. 개발자가 강력한 응용 프로그램을 개발할 수 있도록 많은 UI 구성 요소를 제공하는 SASS를 통해 응용 프로그램을 구축합니다. JavaScript MVVM 프레임 워크 및 AngularJS를 사용하여 응용 프로그램을 향상시킵니다. 데이터의 양방향 바인딩을 제공하며이를 사용하는 것은 웹 및 모바일 개발자에게 공통적 인 선택이됩니다. Ionic은 웹 개발 기술을 사용하는 데 중점을두고 HTML5를 기반으로 한 휴대 전화 플랫폼과 유사한 기본 응용 프로그램을 생성하는 개발 프레임 워크입니다. 이온 프레임 워크의 목적은 웹 관점에서 모바일 애플리케이션을 개발하는 것입니다. 다양한 플랫폼의 응용 프로그램으로 컴파일 할 수있는 PhoneGap의 컴파일 플랫폼을 기반으로합니다.
이 기사에서는 IOINC에서 풀다운 새로 고침 및 풀업 하중 기능을 구현하는 방법을 소개합니다. 이 기능은 종종 프로젝트 개발 중에 발생합니다. 관심있는 친구들을 볼 수 있습니다.
HTML 부분
<iOn-view view-title = "message untification"> <il-content> <!-<ION-REFRESHER> 풀다운 새로 고침 명령-> <ION-REFRESHER PUTRING-TEXT = "ON-REFRESH ="vm.DOREFRESH () "> </ision-refresher> <hip-repeat ="vm.messages의 메시지 " > <div> {{message.title}} <i ng-click = "vm.show (messag )}}}} </div> </div> <!-이온-인치 나이트 스크롤 풀업 데이터로드 명령어 % nf-if의 값이 거짓일 때-> in-infinite-scroll ng-if = "! vm.moredata"vm.loadmore () "diston" " %" >/ION-Infinite-Scroll> </iion-content> </iion-view>JS 부분
• 기능 함수 실행이 끝나기 전에 온 프레시 풀다운에 의해 트리거 된 기능 함수는 $ scope. $ broadcast ( 'scroll.refreshcomplete');
• Infinite Out-Up으로 트리거 된 기능은 또한 방송 이벤트 $ Scope를 종료해야합니다. $ broadcast ( 'scroll.infinitescrollcomplete');
Angular.Module ( 'starter.controllers', []). 컨트롤러 ( 'infoctrl', function ($ rootscope, $ timeout, $ interval, $ scope, $ http, services) {var vm = $ scope.vm = {moredata : false, message : [], pagination :, currentpage :}, function (furning). {services.getMessages ({perpage : vm.pagination.perpage, page : vm.pagination.currentpage}, function (data) {vm.messages = data;})}, show : function (message) {message.static = false;} else (message.static = true) () {$ scope. $ broadcast ( 'scroll.refreshcomplete');},);}, loadmore : function () {vm.pagination.currentpage +=; services.getMessages ({perpage : vm.pagination.perpage, page : vm.pagination.currentpage}, function (data) {vm.messages = vm.messages = {vm.pagination. vm.messages.concat (data); if (data.length ==) {vm.moredata = true;}; $ scope. $ broadcast ( 'scroll.infinitescrollcomplete')}} vm.init ();}).여기의 메시지는보기에 표시된 데이터이며, 페이지 매김은 페이지 매김로드에 표시되는 매개 변수이며 서비스는 내가 캡슐화 한 $ HTTP 서비스이며, 표시 방법은 뷰 정보 디스플레이를위한 스위치입니다 (이에주의를 기울일 필요가 없습니다).
Ionic이 편집자가 소개 한 풀다운 새로 고침 및 풀업 하중을 구현할 수있는 방법에 대한 관련 컨텐츠를 소개했습니다. 나는 그것이 당신에게 도움이되기를 바랍니다. 더 알고 싶다면 Wulin.com 웹 사이트에주의를 기울이십시오!