离子 - 从控制器强制刷新动画

任何人都知道是否有办法从控制器的离子刷新触发刷新动画？离子 - 从控制器强制刷新动画

我想与进修纺纱启动页面

我试图模拟与$ionicScrollDelegate.scrollBottom()拉动作，也通过在复习中设置delegate-handle和主叫从那里$ionicScrollDelegate.$getByHandle('scroll').scrollBottom()没有成功滚动。

有什么想法？

在此先感谢！

来源

2014-10-16 atc

我终于创建了自己的指令，这个我分享，如果有人正在实现相同

loadingDirective.js

angular.module('app') 
.directive('loadingDirective', ['$compile', function($compile) { 
    'use strict'; 

    var loadingTemplate = '<div class="loading-directive"><i class="icon ion-loading-d" /></div>'; 

    var _linker = function(scope, element, attrs) { 
    element.html(loadingTemplate); 
    $compile(element.contents())(scope); 

    scope.$on('loading.hide', function() { 
     element.addClass('closing'); 
    }); 
    scope.$on('loading.show', function() { 
     element.removeClass('closing'); 
    }); 
    }; 

    return { 
    restrict: 'E', 
    link: _linker, 
    scope: { 
     content: '=' 
    } 
    }; 
}]);

loadingDirective.sass

loading-directive { 
    width: 100%; 
    font-size: 30px; 
    text-align: center; 
    color: $scroll-refresh-icon-color; 
    padding: 20px 0 10px 0; 

    height: 60px; 
    display: block; 


    @include transition(height, padding .2s); 

    .loading-directive { 
    -webkit-transform: scale(1,1); 
    transform: scale(1,1); 

    @include transition(transform .2s); 
    @include transition(-webkit-transform .2s); 
    } 

    &.closing { 
    height: 0px; 
    padding: 0px; 

    .loading-directive { 
     -webkit-transform: scale(0,0); 
     transform: scale(0,0); 
    } 
    } 

    i { 
    -webkit-animation-duration: 1.5s; 
    -moz-animation-duration: 1.5s; 
    animation-duration: 1.5s; 
    } 
}

要在模板中使用它，只是在内容的beggining添加<loading-directive>标签：

template.html

<ion-view> 
    <ion-content> 
    <loading-directive></loading-directive> 
    <ion-refresher ng-if="refresherActive" pulling-text="Pull to refresh" on-refresh="refreshData()"> 
    <ion-list></ion-list> 
    </ion-content> 
</ion-view>

装货将显示视图时加载，直到收盘事件被触发从控制器，$scope.$broadcast('loading.hide')将关闭加载图标和$scope.$broadcast('loading.show')将再次显示它

来源

2014-10-20 18:46:27 atc

无法通过Ionic的API触发刷新。刷新组件通过滚动滚动区域（开始暴露刷新区域）来工作，这是用户在下拉时必须执行的操作。

最好的办法是显示加载正在发生与其他一些接口组件。

来源

2014-10-18 19:49:41

感谢您的信息。我终于创建了一个自定义指令。我发布了下面的代码，如果有人有同样的问题 – atc 2014-10-20 18:53:40

您可以只使用ion-spinner指令直接。下拉后，Ionic的拉到刷新显示ion-spinner指令。

HTML：

<ion-spinner ng-if="isLoading"></ion-spinner>

JS：

（在你的控制器......）

$scope.isLoading = true; 

myFetchDataFunction().then(function() { 
    $scope.isLoading = false; 
});

来源

2015-08-04 21:01:14 yndolok

这么简单，但完美的作品。谢谢！ – janpio 2015-09-16 10:29:40

离子 - 从控制器强制刷新动画

回答

相关问题