角度/ Ionic：コンポーネントのロード中にスピナーを表示する方法

Question

多くのアイテムを表示するのにng-repeatを使用していますが、ロードするアイテムがある場合はion-spinnerを表示します。

<div> 
    <ion-spinner icon="ripple"></ion-spinner> 
</div> 
<ion-list> 
    <ion-item 
    ng-repeat="item in items" 
    ng-show="rendered"> 
    <mycomp on-render="rendered = $(completed)"></myomp> 
    </ion-item> 
</ion-list> 

<mycomp>は、コールがon-renderが

私はこれをどのように行うことができます読み込まれていることを、サーバからデータを取得するカスタムコンポーネントです：

これは私のIonicテンプレートですか？おかげ

Answer 1

でそれを使用してください。

工場

app.factory('MultiLoading', function($ionicLoading) { 
//Loading indicator 
var loading = { 
    opened: 0, 
    show: function() { 
     if (loading.opened > 0) 
      return; 
     $ionicLoading.show({ 
      noBackdrop :false, 
      template: '<ion-spinner icon="ripple"></ion-spinner>', 
      duration :20000 
     }); 
     loading.opened+=1; 
    }, 
    hide: function() { 
     loading.opened = 0; 
     $ionicLoading.hide(); 
    } 
}; 
return loading; 
}); 

よろしく。

Answer 2

はあなたが工場を作成し、応答が提供された後、APIコールとMultiLoading.hide()を行う前にMultiLoading.show()のように示すことができるコントローラー

$ionicLoading.show({content: 'Loading', animation: 'fade-in',showBackdrop: true, maxWidth: 200,showDelay: 0});