Question

我真的需要你的帮助，我是离子项目的新手。目前正在开展一个项目。这个应用程序使用$ http从wordpress中提取博客文章。如何添加进度条告诉用户页面正在加载，而不是有空白屏幕？谢谢

Answer 1

您可以使用create or replace PROCEDURE total_att IS cols varchar2(4000); col varchar2(4000); i number; where_str varchar2(4000); sqlstr varchar2(4000); BEGIN for i in 1..31 loop col:='day' || i; cols:=cols||col ||','; where_str:=where_str || col ||'=''P'' OR '; end loop; cols:=substr(cols,1,length(cols)-1); sqlstr:='SELECT MONTH,'||cols||' from hss_attendance where '|| where_str ; sqlstr:=substr(sqlstr,1,length(sqlstr)-3) ' ; dbms_output.put_line(sqlstr); END total_att;

可用于在阻止用户互动时指示活动的叠加层。

在控制器内触发加载。首先，我们需要在控制器中注入$ ionicLoading作为依赖项。之后我们需要调用$ ionicLoading.show（）方法并显示加载。为了禁用它，有$ ionicLoading.hide（）方法。

实施例： -

 create or replace PROCEDURE total_att_new  IS
    cols varchar2(4000);
    col varchar2(4000);
    i number;
    where_str varchar2(4000);
    sqlstr varchar2(4000);
    sqlstrs clob;
    BEGIN
    for i in 1..32 loop
    col:='day' || i;
    sqlstr:='select month,
    case '||col||' when ''P''
    then 1 else 0 end as att
    from hss_attendance
    where student_id = ''4003''
    and month=''4''
    union ';
    sqlstrs:=sqlstrs || sqlstr;
    end loop;
    dbms_output.put_line(sqlstrs);
    END total_att_new;

Read this for more information

Answer 2

您可以使用$httpProvider.interceptors来跟踪http来电。

您可以找到工厂写的显示离子装载机 here

或者

您可以通过在项目中添加以下代码来实现此目的。

在angular.module('app',[]).run(...)

中添加以下代码

        $rootScope.$on('loading:show', function () {
            $ionicLoading.show({ template: '<ion-spinner class="spinner-assertive"></ion-spinner>' })
        })

        $rootScope.$on('loading:hide', function () {
            $ionicLoading.hide()
        })

在angular.module('app',[]).config(...)

中添加以下代码

   $httpProvider.interceptors.push(function ($rootScope) {
        return {
            request: function (config) {
                $rootScope.$broadcast('loading:show')
                return config
            },
            response: function (response) {
                $rootScope.$broadcast('loading:hide')
                return response
            }
        }
    })

Answer 3

使用$ionicLoading指令来显示和隐藏微调器。这是一个例子。只需在show()来电之前拨打$http，然后在.success()之后隐藏。

controller('myCtrl', function($scope, $ionicLoading) {
  $ionicLoading.show({
     template: '<ion-spinner icon="android"></ion-spinner>'
  });
  $http({
      method: 'POST',
      url: 'http://example.com',
  })
      .success(function(){
          $ionicLoading.hide();
      });
});

如何在离子应用程序中添加进度条

3 个答案: