Ionic ion-refresher ion-infinite-scroll 自定义loading动画

在ionic.bundle.js中，有两个我也不知道叫什么的东西，分别是:
1.下拉刷新

.directive('ionRefresher', [function() {  return {    restrict: 'E',    replace: true,    require: ['?^$ionicScroll', 'ionRefresher'],    controller: '$ionicRefresher',    template:    '<div class="scroll-refresher invisible" collection-repeat-ignore>' +      '<div class="ionic-refresher-content" ' +      'ng-class="{\'ionic-refresher-with-text\': pullingText || refreshingText}">' +        '<div class="icon-pulling" ng-class="{\'pulling-rotation-disabled\':disablePullingRotation}">' +          '<i class="icon {{pullingIcon}}"></i>' +        '</div>' +        '<div class="text-pulling" ng-bind-html="pullingText"></div>' +        '<div class="icon-refreshing">' +          '<ion-spinner ng-if="showSpinner" icon="{{spinner}}"></ion-spinner>' +          '<i ng-if="showIcon" class="icon {{refreshingIcon}}"></i>' +        '</div>' +        '<div class="text-refreshing" ng-bind-html="refreshingText"></div>' +      '</div>' +    '</div>',    link: function($scope, $element, $attrs, ctrls) {      // JS Scrolling uses the scroll controller      var scrollCtrl = ctrls[0],          refresherCtrl = ctrls[1];      if (!scrollCtrl || scrollCtrl.isNative()) {        // Kick off native scrolling        refresherCtrl.init();      } else {        $element[0].classList.add('js-scrolling');        scrollCtrl._setRefresher(          $scope,          $element[0],          refresherCtrl.getRefresherDomMethods()        );        $scope.$on('scroll.refreshComplete', function() {          $scope.$evalAsync(function() {            scrollCtrl.scrollView.finishPullToRefresh();          });        });      }    }  };}]);

2.上拉加载更多

.directive('ionInfiniteScroll', ['$timeout', function($timeout) {  return {    restrict: 'E',    require: ['?^$ionicScroll', 'ionInfiniteScroll'],    template: function($element, $attrs) {      if ($attrs.icon) return '<i class="icon {{icon()}} icon-refreshing {{scrollingType}}"></i>';      return '<ion-spinner icon="{{spinner()}}"></ion-spinner>';    },    scope: true,    controller: '$ionInfiniteScroll',    link: function($scope, $element, $attrs, ctrls) {      var infiniteScrollCtrl = ctrls[1];      var scrollCtrl = infiniteScrollCtrl.scrollCtrl = ctrls[0];      var jsScrolling = infiniteScrollCtrl.jsScrolling = !scrollCtrl.isNative();      // if this view is not beneath a scrollCtrl, it can't be injected, proceed w/ native scrolling      if (jsScrolling) {        infiniteScrollCtrl.scrollView = scrollCtrl.scrollView;        $scope.scrollingType = 'js-scrolling';        //bind to JS scroll events        scrollCtrl.$element.on('scroll', infiniteScrollCtrl.checkBounds);      } else {        // grabbing the scrollable element, to determine dimensions, and current scroll pos        var scrollEl = ionic.DomUtil.getParentOrSelfWithClass($element[0].parentNode, 'overflow-scroll');        infiniteScrollCtrl.scrollEl = scrollEl;        // if there's no scroll controller, and no overflow scroll div, infinite scroll wont work        if (!scrollEl) {          throw 'Infinite scroll must be used inside a scrollable div';        }        //bind to native scroll events        infiniteScrollCtrl.scrollEl.addEventListener('scroll', infiniteScrollCtrl.checkBounds);      }      // Optionally check bounds on start after scrollView is fully rendered      var doImmediateCheck = isDefined($attrs.immediateCheck) ? $scope.$eval($attrs.immediateCheck) : true;      if (doImmediateCheck) {        $timeout(function() { infiniteScrollCtrl.checkBounds(); });      }    }  };}]);

以上两段代码，template即为加载中时显示的样式，修改之即可。
我这里只是简单的修改了下，将其改为：
下拉刷新：

template:    '<div class="scroll-refresher invisible" collection-repeat-ignore style="text-align:center;">' +                            '<img src="./img/ui_three/is-loading.gif"></img>'+    '</div>',

上拉加载更多

template: function($element, $attrs) {      **return '<ion-spinner icon="{{spinner()}}"></ion-spinner>';**    },

对phonegap了解的不是很深入，只是碰到了找了下解决办法呦。