2016-10-20 4 views
0

Я использую директиву ion-refresher для реализации pull для обновления в моем приложении. Пока что я могу реализовать его на контролерах и соответствующих HTML-файлахЛучший способ реализовать pullToRefresh на Ionic App

Мне нужно реализовать его для всех моих экранов. Каждый, если мои экраны имеют другой набор функций обещания, которые нужно вызвать. Я хочу избежать написания одного и того же кода для каждого экрана.

Есть ли способ подключить doRefresh к корневой области и реализовать эту директиву, чтобы я мог избежать повторения и спама в моем коде.

Любые предложения будут полезны

ответ

1

За то, что ион-освежитель на каждой странице вашего приложения и иметь функцию обновления в одном месте, вы должны написать функцию в app.js файл что-то вроде:

.run(function($ionicPlatform, $rootScope, $http) { 
    $ionicPlatform.ready(function() { 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
    // for form inputs) 
    if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
     cordova.plugins.Keyboard.disableScroll(true); 

    } 
    if (window.StatusBar) { 
     // org.apache.cordova.statusbar required 
     StatusBar.styleDefault(); 
    } 

    $rootScope.doRefresh = function(page) { 
     $http.get('PATH OF API') 
     .success(function(newItems) { 
      console.log("success "+page); 
     }) 
     .finally(function() { 
     // Stop the ion-refresher from spinning 
     $rootScope.$broadcast('scroll.refreshComplete'); 
     }); 
    }; 

    }); 
}) 

После этого говорят, например, у вас есть 3 страницы в приложении под названием 1) Dashboard 2) Чаты 3) счет, то вы должны написать ниже упомянутой директивы в каждом файле шаблона:

<ion-refresher 
    pulling-text="Pull to refresh..." 
    on-refresh="doRefresh('dash')"> 
    </ion-refresher> 
    <ion-list> 
    <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="chat in chats" type="item-text-wrap" href="#/tab/chats/{{chat.id}}"> 
     <img ng-src="{{chat.face}}"> 
     <h2>{{chat.name}}</h2> 
     <p>{{chat.lastText}}</p> 
     <i class="icon ion-chevron-right icon-accessory"></i> 

     <ion-option-button class="button-assertive" ng-click="remove(chat)"> 
     Delete 
     </ion-option-button> 
    </ion-item> 
    </ion-list> 

здесь doRefresh ('dash') - это функция с аргументом, которая имеет текущее имя экрана (здесь это тире для панели инструментов). Аналогично для других страниц.

Теперь внутри функции dorefresh() в файле app.js вы можете поместить условие на основе переданного аргумента в функцию и вызвать функцию обещания.

Надеюсь, вы найдете правильный ответ.

+0

Спасибо .. это помогает! –